I am not sure that this is collapsing margins..perhaps I don't get margin
collapse but I thought it meant if 2 block level items touching vertically,
the larger margin value will be expressed, the smaller will disappear.
what I'm seeing here as the problem is child element margin top value is
pushing its parent downward.
and I don't get why? Is the parent the boss of the child?
Thank yoU!
John
On May 12, 2013, at 2:17 PM, Mauricio Silva css.mau...@gmail.com wrote:
Hi J,
THis happens due the classic CSS Collapsing Margins behavior
Have a look at: http://css-discuss.incutio.com/wiki/Collapsing_Margin
for a compreensive explanation.
Regards
Maurício Samy Silva
http://maujor.com
http://facebook.com/maujor
@maujor
-Mensagem original-
De: css-d-boun...@lists.css-discuss.org
[mailto:css-d-boun...@lists.css-discuss.org] Em nome de COM
Enviada em: domingo, 12 de maio de 2013 17:50
Para: CSS-Discuss
Assunto: [css-d] child margin affecting parent?
Given the css below, why should the header margin value also push the
wrapper downward? In my markup, the wrapper div is the parent, margin:0,
auto;
thank you
J
*{
padding:0;
margin:0;
}
body{
background-color:rgb(200,200,200);
font-family:helvetic-neue, Verdana, Arial, sans-serif;
font-size:100%;
}
#wrapper{
margin:0 auto;
width:940px;
padding:0 20px;
background-color:rgb(220,230,220);
}
header{
margin:20px 0 1em 0;
border:red 1px solid;
}
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/ List policies --
http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
