Geek Answers Handbook

Why does IE9 display HTML5 block level elements as inline?

Shouldn't HTML5 work in IE9? This does not work for me.

Here is my HTML5 code:

<!DOCTYPE html> <html> <head><title> Dripel - Welcome </title> <!--[if lt IE 9]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> </head> <body> <header>Welcome to Dripel</header> <section id="main"> I am under development. Please check back later. </section> <footer> </footer> </body> </html>

You can view it at http://www.dripel.com/ .

In IE 9, the <header> and <section> elements are displayed as inline elements. Please note that I am not using CSS at this time.

Any idea what is going on?

+4
source share
3 answers

According to Dive in HTML5, the final version of Internet Explorer 9 will not have this problem .

So, I believe that you are seeing this because IE9 is still in beta. You are right, you should not see this when it is released.

It's probably worthwhile to include the explicit display: block element for HTML5. You (usually) never know when someone is about to see your code in a pre-HTML5 browser.

+1
source

This is true for other browsers, and not just for IE. The same behavior is observed for Firefox 3.6.

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

Use the reset stylesheet, which gives these display: block elements if you want to use them, for example:

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

Copied from Chrome CSS user agent :)

If you want more information, then read the beta release of HTML5 . Nowhere does this explicitly indicate that IE9 "supports" this HTML5 element. Your concept of support is also poorly defined here - what do you mean by support? UA style sheet like the one above? Support for common unspecified items? (A feature that IE9 has, so you don't need a small script to create elements before using them.)

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

+1
source

IE 9 supports some of HTML5. All other browsers do this. HTML5 is not finished yet, and IE 9 is not finished yet, and no browser supports all HTML5. For example, no browsers that I know about <style scoped> or <iframe seamless> support.

I would not expect any browser to support all HTML5 in a single release. HTML5 has many new features, and it is still in a state of change. Browsers implement functions one at a time, sometimes with prefixes, to avoid incompatibilities later, sometimes in beta or development versions, so that the design can be tested to a wider version. It is impossible to write an ideal specification at a time, and then force everyone to implement everything in one go; instead, the functions are implemented experimentally, the specification is written around them, everything is fixed, the specification is updated, and so on, until everyone is happy that it is all very well and implemented in compatible modes between different browsers. It will take quite some time before all this happens for all HTML5.

0
source

More articles:


All Articles