Upozorňujeme, že diskuze pod našimi online kurzy jsou nemoderované a primárně slouží k získávání zpětné vazby pro budoucí vylepšení kurzů. Pro studenty našich rekvalifikačních kurzů nabízíme možnost přímého kontaktu s lektory a studijním referentem pro osobní konzultace a podporu v rámci jejich studia. Toto je exkluzivní služba, která zajišťuje kvalitní a cílenou pomoc v případě jakýchkoli dotazů nebo projektů.
Tak jsem přišel na problém. Menu na telefon má odsazení 50 pixelů od horní pozice a výšku má nastavenou na 100% avšak když je to element který má pozici nastavenou na fixed prostě se dá přes celou stránku (výška 100%) a ještě se odsadí 50 pixelů od horní pozice čímž se zakryje poslední položka tím pádem je potřeba nestavit výšku na 100% - 50px (horní odsazení) tudíž k tomuto účelu použij css funkci calc.
Takže
(style.css:311)
@media (max-width: 1065px) {
.menu__telefon {
width: 100%;
height: 100%;
z-index: 9999999;
overflow: auto;
display: none;
top: 50px;
left: 0px;
position: fixed;
background-color: #A60800;
}
}Nahraď tímto
@media (max-width: 1065px) {
.menu__telefon {
width: 100%;
height: -moz-calc(100% - 50px);
height: -webkit-calc(100% - 50px);
height: -o-calc(100% - 50px);
height: calc(100% - 50px);
z-index: 9999999;
overflow: auto;
display: none;
top: 50px;
left: 0px;
position: fixed;
background-color: #A60800;
}
}V prípade takéhoto prvku výšku vôbec nepotrebuješ poznať, počítať ani nastavovať. Takúto situáciu ide riešiť dvoma lepšími spôsobmi:
Nič z toho ale nerieši nedomyslenú situáciu väčšieho množstva položiek, kde sa niečo natrvalo skryje za okno prehliadača.
Pri určitom vertikálnom a prípadne kvôli zalomeniu riadkov aj
horizontálnom rozlíšení nastav navigácii statickú alebo absolútnu
pozíciu.
Napr.:
@media (max-height: 40em), (max-width: 20em) {
.menu__telefon {position: absolute; bottom: auto;}
}Kvôli zaručenej čitateľnosti aj pri zmenej veľkosti písma použi radšej jednotku em.
Zobrazeno 6 zpráv z 16.
