Modernizr still not able to style some HTML5 tags

HTML & CSS
1

This page…
Bug 5

looks correct in IE9. But not in IE8.

The brown-outlined box should be centered across the browser because I have this CSS rule…

article {
width: 300px;
margin: 30px auto;
text-align:center;
border: 1px solid #963;
}

I’ve added modernizr which is supposed to make IE8 be able to style HTML5 tags like “article”. But not working.

Do a view source and see what I’m doing wrong. Is modernizr not as great as I thought? Or am I implementing something wrong?

2

I also tried HTML5shim, but that also fails in IE8. See…
Bug 5 Shim

3

You need display: block;
The script allows you to style the new elements, but they don’t automatically become block level.

Probably best to block all the HTML5 elements that you plan to use


header, footer, article, nav {display: block;}
4

Ah, that’s it. It is fixed now. thanks.