Autor Zpráva
novinovik
Profil
Sem začátečník a nevím si rady:
<html>
<head>

<title>Hlavní stránka</title>

<style>


.hlavicka {
width: 800px;
border: 1px solid gray;
height: 150px;
}


.casovepasmo {
position: relative;
top: 2px;
width: 800px;
border: 1px solid black;
padding: 1px;

}


a {
display: block;
}


</style>
</head>

<body>
<div class=hlavicka></div>
<div class=casovepasmo>Aktuální čas</div>

</body>

</html>

V IE to je normální ale v Mozille ten rámeček jak tam je Aktuální čas, tak ten je posunut. nevíte jak to srovnat? Díky moc
Anonymní
Profil *
U Mozilly ti to dělá nastavený padding u třídy .casovepasmo, v tomto případě se jeho šířka (výška) přičítá k celkové šířce (výšce) třídy .casovepasmo, šířka má pak 802px, pokud však upravíš šířku na 798px, bude to dělat neplechu v IE.
možné řešení:

- zruš padding u .casovepasmo
- uzavři text "Aktuální čas" do dalšího DIVu nebo SPANu, kterému nastavíš margin, asi bude stačit margin-left pro odsazení od levého okraje, ne?
novinovik
Profil
jj zkusim to ;)
venca163
Profil
novinovik
univerzálním řešením je přidat do css
* {-moz-box-sizing: border-box; box-sizing: border-box;}
a všechny prohlížeče by to měly počítat stejně jako IE...

není to validní, ale mě to funguje bezproblémů a proto jsem nadmíru spokojen...
kdo doplní nevýhody?? děkuji
Toto téma je uzamčeno. Odpověď nelze zaslat.

0