I can't seem to figure out why there is a white gap showing up between two of my divs in Firefox (explorer shows it ok, so my code is probably wrong hehehe):
<style>
#conteudoHome {
width: 750px;
height: 305px;
}
#rodapeHome {
background-image:url(../images/bg_rodapeHome.gif);
width: 750px;
height: 160px;
text-align:left;
}
</style>
<div id="conteudoHome"><img src=http://www.webdeveloper.com/forum/archive/index.php/"images/flashPlaceholder_home.jpg" /></div>
<div id="rodapeHome">
<div style="margin: 10px 0px 0px 10px;">Teste</div>
</div>
What I wanted to do is have the div with the "Teste" text in it have a top and left margin of 10px. For some reason, the rodapeHome div is the one receiving the margin properties so a white gap opens up between it and the conteudoHome div above it.
Any ideas? Cheers!It's a bug in FF. Change the margin to padding.Yup, that did it Fang, thanks!!It's a bug in FF.No it's not, that's how margins are meant to work.The child margin affecting the parent background? I think not!No, the child margin "sitcks out" (for want of a better phrase) of the parent element.Only the child's top margin affects the parent in this way.Wow you guys know a lot about CSS lol...
Honestly, I would just keep experimenting between padding and margins
That's the beauty of CSS i guess 
Only the child's top margin affects the parent in this way.Yeah, and that's what was creating the white gap.
<style>
#conteudoHome {
width: 750px;
height: 305px;
}
#rodapeHome {
background-image:url(../images/bg_rodapeHome.gif);
width: 750px;
height: 160px;
text-align:left;
}
</style>
<div id="conteudoHome"><img src=http://www.webdeveloper.com/forum/archive/index.php/"images/flashPlaceholder_home.jpg" /></div>
<div id="rodapeHome">
<div style="margin: 10px 0px 0px 10px;">Teste</div>
</div>
What I wanted to do is have the div with the "Teste" text in it have a top and left margin of 10px. For some reason, the rodapeHome div is the one receiving the margin properties so a white gap opens up between it and the conteudoHome div above it.
Any ideas? Cheers!It's a bug in FF. Change the margin to padding.Yup, that did it Fang, thanks!!It's a bug in FF.No it's not, that's how margins are meant to work.The child margin affecting the parent background? I think not!No, the child margin "sitcks out" (for want of a better phrase) of the parent element.Only the child's top margin affects the parent in this way.Wow you guys know a lot about CSS lol...
Honestly, I would just keep experimenting between padding and margins
That's the beauty of CSS i guess Only the child's top margin affects the parent in this way.Yeah, and that's what was creating the white gap.