| Autor | Zpráva | ||
|---|---|---|---|
| DDD Profil |
#1 · Zasláno: 14. 4. 2008, 20:02:47
Mám div a v něm odstavec s daným marginem, např.:
<html> <body style="margin:0px"> <div style="height:600px;width:600px;background:#000"> <p style="height:100px;width:100%;margin:100px 0 0 0;padding:0;background:red">text</p> </div> </body> </html> Očekával bych, že div zůstane nahoře a text odstavce se posune o hodnotu marginu, místo toho se ale (ve FF a Opeře) posune celý div, jako by margin měl nadefinivaný on a text zůstane u okraje divu. V IE6 to funguje tak, jak chci, přestože rozdílný box model má jen u paddingu a borderu. Čím to je? Potřebuji to z tohoto důvodu: Měl jsem nastylovaný nadpis h1 na šířku obrazovky a pod ním vycentrovaný div s pevnou šířkou se zbytkem obsahu. Pak jsem si ale usmyslel, že chci mít patičku vždy dole a na to potřebuju mít div s výškou 100%, tak mě napadlo, že nahoře nějak udělám mezeru s pomocí prvního vnitřního prvku (drobečky) a h1 tam pak absolutně napozicuji: -u marginu mi vznikl problém, který jsem popsal -padding tam dát nemůžu kvůli různým box modelům (drobečky mají danou šířkou) -když zvýším výšku drobečků, jejich text zůstane nahoře a h1 by je překryl, jedině když zvýším hodnotu line-height na skoro dvojnásobnou hodnotu šířky, text bude dole - pokud nevymyslím nic lepšího, tak budu muset použít tohle -ještě jsem zkoušel jiné věci, ty ale zase fungovaly jen v IE (např. nastylovat nějak odkazy v drobečcích) -další div tam dát nechci Napadá vás, jak ještě to udělat? Děkuji. |
||
| Davex Profil |
#2 · Zasláno: 14. 4. 2008, 21:17:29
V tomto případě dochází ke slučování okrajů podle CSS 2.1 - Collapsing margins. Obalovému divu definuj overflow jiné než visible nebo přidej padding-top, border-top, a nebo ho rozplavej pomocí float.
|
||
| DDD Profil |
#3 · Zasláno: 14. 4. 2008, 21:48:08
Díky moc! To jsem potřeboval...
|
||
|
Časová prodleva: 4 dny
|
|||
| DDD Profil |
#4 · Zasláno: 18. 4. 2008, 20:55:35
Už jsem se radoval... a mám další problém:
Když obalovému divu nastavým výšku 100%, patička je vždy dole. Když se ale text uvnitř divu nevejde na obrazovku a začne zajíždět pod patičku (obalovanému divu jsem nastavil overflow:hidden), což je normální, protože div má pevnou výšku. Stejně se to ale chová i v IE, přitom ten by měl brát height jako min-height. A když nastavím min-height, tak bych čekal, že bude patička dole a pak se roztáhne, jenomže se to chová, jako by tam nebylo napsáno nic - patička zůstane za textem. Nevíte, co dělat s tímhle? |
||
|
Časová prodleva: 16 let
|
|||
0