Hi Everyone,
Ok, so its not "inherited" since the code is filtering though from a child, so its kinda backwards but...
I have uploaded an example of the problem at hand... if you notice the red #container div should be flush with the top of the page, and the #content div should be 20px lower... however what is actually happening is that the #content div is in the right place but #container also gets the 20px gap
Its something that happens to me time and time again and i don't understand it... when a margin is needed and padding can't be used, how do i do this? is it maybe a css bug or am i doing it wrong?
note: I have noticed that adding a border to the #container fixes it, which is strange (but obviously, I want a proper solution without a border )
Thanks chaps
Have I asked a question that
Have I asked a question that uncovers a huge bug and is actually taboo to talk about
This problem can be hacked by adding float:left and clear:both or border-top to the #container, but i'd prefer to fully understand the problem rather than hack my way through it...
Anyone?
The fact that you say
The fact that you say inherited from a child and then state floating parent or adding border-top to parent fixes the issue immediately tells us you have stumbled on the condition known as 'Collapsing Margins' it's not a bug but a proscribed behaviour. A quick search through the forum archives will throw up old posts on the subject or Google.