HTML5 <section> element doesn't accept a negative margin-top in Firefox 3.6.x

Question

I'm trying to use a negative top margin on a element and it is not working in Firefox. Chrome and IE (using HTML5-shiv) are rendering it properly. I have given the HTML5 elements (including a display: block).

Thoughts? CSS if you need it:

aside, article, section { display: block; }


section#banner {
background: url(images/banner.png) no-repeat 3px 3px;
border: #CCD1DB 1px solid;
-moz-border-radius: 10px; /* FF1+ */
-webkit-border-radius: 10px; /* Saf3+, Chrome */
border-radius: 10px; /* Opera 10.5, IE 9 */
-moz-box-shadow: 0px 0px 4px #E0E3E9; /* FF3.5+ */
-webkit-box-shadow: 0px 0px 4px #E0E3E9; /* Saf3.0+, Chrome */
box-shadow: 0px 0px 4px #E0E3E9; /* Opera 10.5, IE 9.0 */
display: block;
height: 350px;
margin: -50px auto 0;
overflow: hidden;
padding: 3px;
position: relative;
width: 600px;
}

Answer 1

http://dev.w3.org/html5/spec/Overview.html#the-section-element

The section element is not a generic container element. When an element is needed for styling purposes or as a convenience for scripting, authors are encouraged to use the div element instead. A general rule is that the section element is appropriate only if the element's contents would be listed explicitly in the document's outline.

More resources: http://html5doctor.com/the-section-element/