CSS margin spacing differently for top and sides?

That's due to 'margin collapsing': the smallest adjacent vertical margin is ignored in the most simple case.

Thanks for the quick reply as well. Please see question 2 aboe if you have any insight. Thanks again!

– David Houde Nov 18 '10 at 23:26 One option is to apply a transparent single pixel border around each object. Of course, you'll then have to account for that change, but it's a simple quick fix if you're using absolute values for dimensions. – Bobby Jack Nov 18 '10 at 23:29 1 Btw, this is a good reference: reference.sitepoint.Com/css/collapsingmargins – Bobby Jack Nov 18 '10 at 23:30.

Try using padding instead of margin. The largest margin between two objects is used as the space between them. If object_a has a margin of 4, and object_b has a margin of 6, if you place them side by side, they will have a margin of 6.

If you use padding, it creates more of a bubble around them, and combines the distance. If object_a has a padding of 4, and object_b has a padding of 6, if you place them side by side, they will have a padding of 10. UPDATE -- thanks to @Bobby Jack Horizontal margins never collapse.

Only vertical.

Thanks for the quick reply. I learn something new everyday. Do you happen to know of the simplest way to achieve this with my layout?

When I use margin, it creates space outside of the div. When I use padding, it creates space inside the div, in turn making the div 4px wider on each side. I can see using this idea with nesting the div's and keeping the outside div transparent with a padding of 4px.

I just don't know if this is the most elegant way, if so no problem. Just want to make sure im not missing something – David Houde Nov 18 '10 at 23:26 It's important to note that margin collapsing only affects vertical margins. Your use of the term 'side by side' might be taken to mean otherwise.

– Bobby Jack Nov 18 '10 at 23:26 @ Bobby -- Really? I've never heard of that, do you have an article? It seems that it has always affected me.

– Kerry Nov 18 '10 at 23:32 @ David -- you can adjust the margins specifically so that if you need more or less, its 8px on certain sides and not on others, etc. – Kerry Nov 18 '10 at 23:33 1 from the spec (w3. Org/TR/CSS2/box. Html#x26): "In CSS 2.1, horizontal margins never collapse" ;-) – Bobby Jack Nov 18 '10 at 23:36.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.