A simple top margin question

Here’s probably the simplest site you’ve seen a question about.

It has a Section with a Container inside of the Section and a Heading inside the Container. Both the Section and the Container have background color set just for the sake of visibility. The heading is there simply to have a bit of content as a point of reference.

The Section top margin is set to 30px. When I attempt to set a top margin on the Container it isn’t pushed down from it’s parent but rather from the top of the VP/Body. Once the Container top margin reaches 30px it AND the Section are pushed further from the top of VP.

Shouldn’t setting a top margin on the Container push it down from the top of the Section?


Here is my site Read-Only: https://preview.webflow.com/preview/jforbes?utm_medium=preview_link&utm_source=designer&utm_content=jforbes&preview=9ee7cb8daa4f351cf028499c624ec570&workflow=preview

I did not look at your share but it sounds like margin collapse. Here is a reference. Mastering margin collapsing - CSS: Cascading Style Sheets | MDN

Thanks Jeff. I thought about margin collapse and set a height then a min-height to no avail. Maybe I’ll try a border. This is really no grand issue. It’s just that I noticed it when doing some element testing.