ugrás a tartalomhoz

Div magassága és bekezdés margin nem stimmel.

s_volenszki · 2006. Szep. 18. (H), 21.51
Hahó!

Van három div-em:

<div style="background:#ff0000;width:250">Szöveg</div>
<div style="background:#ffaa00;width:250">Szöveg</div>
<div style="background:#99aa00;width:250">Szöveg</div>
ez így baró:


de ha a középső szöveg bekezdésbe kerül:

<div style="background:#ff0000;width:250">Szöveg</div>
<div style="background:#ffaa00;width:250"><p>Szöveg</p></div>
<div style="background:#99aa00;width:250">Szöveg</div>
akkor:

a bekezdés margin-ja miatt szétnyomja (csak IE nem) a diveket és a hátteret nem szinezi ki!

Hogyan tudom utasítani a középső div-et, hogy bármilyen belekerülö elem teljes határáig töltsön ki (színnel, háttárrel)?

s_volenszki
‹ div hatter es tartalom viszonya Doctype-ban hivatkozás egy .dtd fájlra. ›
 ■
1

sztem nem lehet

Off- · 2006. Szep. 18. (H), 22.57
Üdv.

Ezzel a problémával már én is találkoztam, és sztem sehogy sem lehet megmondani egy divnek, hogy a benne lévő elemeknek mekkora legyen a margója, kitöltése..

Firefoxban ez megy:

css:
#adiv > :first-child { margin: 0 }
html:
<div style="background:#ff0000;width:250">Szöveg</div>
<div id="adiv" style="background:#ffaa00;width:250"><p>Szöveg</p></div>
<div style="background:#99aa00;width:250">Szöveg</div>
de tudom ez nem teljes értékü megoldás.. :-)
2

Meg kell akadályoznod, hogy a két margó érintkezzen

Jano · 2006. Szep. 18. (H), 23.14
Meg kell akadályoznod, hogy a két margó érintkezzen. Vagy border vagy legalább 1px-es padding a befoglaló elemen.
3

Ez hihetetlen!

s_volenszki · 2006. Szep. 19. (K), 10.02
Tökéletesen működik! Sohasem jöttem volna rá! Miért baj az nekik, ha összeérnek a margók?

s_volenszki
4

Margin-collapse

Jano · 2006. Szep. 19. (K), 11.41
A dolog nem hülyeség, mégha furcsa is. Képzeld el, hogy van (legalább) 3db bekezdés elemed egymás után, de ebből az első kettőt szeretnéd egy DIV-be zárni. Egy életszerű példa lehet a fenti helyzetre egy cikk, amiben az első két bekezdés "kopf"/"lead" szerepű. A bekezdések között továbbra is szeretnéd ha ugyanolyan hely maradna. Ha a DIV határától számítodna a bezárt margó, akkor a DIV-ben levő második bekezdés és az utána következő - DIV-en kívüli - margó között pontosan 2 margónyi hely keletkezne.

Valójában itt kétféle margin collapse jelenség is van. Előszőr a befoglaló elemek közötti nagyobb margó érvényesül

lead_margin_bottom = max(div_margin_bottom,belso_p_margin_bottom)

majd az egymás követő elemek közül a nagyobb (ami ebben az esetben igazából ugyanannyi)

lead_es_koveto_p_kozotti_hely = max(lead_margin_bottom,koveto_p_margin_top)

Persze ha már bekeretezed a kopfot, akkor az a jó viselkedés, hogy a borderen belűl hat a margó.