ansaurus

Question

Why is IE9 displaying my HTML5 block level elements as inline?

Answer 1

+1 A:

This is true for other browsers too, not just IE. The same behavior can also be observed for Firefox 3.6.

Since HTML5 is only a working draft, the browser vendors have not yet created a default stylesheet for these elements, so by default elements are displayed inline.

Use a reset stylesheet that gives these elements display: block if you want to use them, like:

article, aside, footer, header, hgroup, nav, section {
    display: block;
}

_{Copied from Chrome's User Agent CSS :)}

If you want more info, well then - read the beta release notes on HTML5. Nowhere does it explicitly state that IE9 "support" those HTML5 element. Your concept of support is also ill-defined here - what do you mean support? A UA stylesheet like the one above? Support for generic unspecified elements? (A feature which IE9 have, so you don't need a small script to create the elements prior to using them.)

The HTML5 specs only talks about the semantics of each of these elements, and nothing on how browsers should display them. So do you expect a browser that "support" HTML5 do?

Yi Jiang 2010-09-22 07:05:30

I know I can use reset! But if the saying is true that IE 9 supports HTML5, I should not be using reset to **make it work**

Ruby 2010-09-22 07:22:00

As pritaeas put it: "IE9 is still in beta, so that may be the reason too. – pritaeas" - remember it is IE we are talking about, just because it's version 9 doesn't change the fact it's still ie.

balupton 2010-09-22 07:23:09

Answer 2

+1 A:

According to Dive into HTML5, the final version of Internet Explorer 9 won’t have this problem.

So I reckon you’re seeing this because IE9 is still in beta. You’re right, you shouldn’t see this when it’s released.

It’s probably worth including the explicit display: block for HTML5 elements anyway. You (usually) never know when someone’s going to look at your code in a pre-HTML5 browser.

Paul D. Waite 2010-09-22 11:04:02

I am already using HTML5 rest (in my dev machine) ... this question was just out of curiosity!

Ruby 2010-09-22 15:32:56

Answer 3

A:

IE 9 supports some of HTML5. So do all of the other browsers. HTML5 is not yet finished, and IE 9 is not yet finished, and no browsers supports all of HTML5. For instance, no browsers that I know of support <style scoped> or <iframe seamless> yet.

I wouldn't expect any browser to support all of HTML5 in one release. HTML5 has a lot of new functionality, and it is still in a state of flux. Browsers are implementing features one at a time, sometimes with prefixes to avoid incompatibility later, sometimes in beta or development versions so that the design can be tested out before a wider release. It's not possible to write a perfect spec all in one go, and then have everyone implement it all in one go; instead, features are implemented experimentally, the spec is written around them, things are fixed, the spec is updated, and so on, until everyone is happy that it's all pretty good and is implemented in compatible ways between different browsers. It will be quite a while yet before all of that happens for all of HTML5.

Brian Campbell 2010-09-22 21:59:41

ansaurus

tags:

views:

answers:

Why is IE9 displaying my HTML5 block level elements as inline?

related questions