Perhaps I am having a brain block as what I want to accomplish does seem rather straight-forward…
I have a div id=”content”, inside a div id=”container”.
indside #content I have an H1 tag, which due to my reset.css is almost touching the top of #content.
I would like a small margin between the top of the H1 and the top of #content, however when I apply margin-top:10px to the H1 the whole #content moves down with #container.
that’s the correct implementation of margin collapse. There are a number of ways to get the results you’re looking for. You could add a top padding or top border to #content (1px will do), or you could give #content overflow: hidden; to change it’s block formatting context. In any of these three cases, the h1 margin will now ‘push’ against the top of #content and not extend beyond it.