William
William

Reputation: 8808

HTML5 tags not working at all in firefox 3.6.3

Okay, so I'm trying to get into this whole HTML 5 thing, and this tutorial (http://www.webreference.com/authoring/languages/html/HTML5/) says that these tags should move the content around without any kind of CSS at all, but all I'm getting is a line of text that looks like this:

 Header tag   Nav tag    Artical Section tags    Aside tag   footer tag  

Here is the code:

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>HTML5 test1</title>
        <meta charset="utf-8" />
    </head>

    <body> 
        <header>
            Header tag
        </header> 

        <nav>
            Nav tag
        </nav> 

        <article> 
            <section> 
                Artical Section tags
            </section> 
        </article>

        <aside>
            Aside tag
        </aside> 

        <footer>
            footer tag
        </footer> 
    </body>  
</html>

Upvotes: 22

Views: 12269

Answers (3)

Delan Azabani
Delan Azabani

Reputation: 81404

Firefox 3.6 doesn't support HTML 5 sectioning elements yet. You will have to manually style the tags to be block level:

article, aside, canvas, details,
figcaption, figure, footer, header,
hgroup, nav, section, summary, video {
    display: block;
}

You won't need the HTML shim, however; that's just for IE.

Upvotes: 32

Josh Lee
Josh Lee

Reputation: 177624

These tags don’t work at all in Firefox 3.6.11 and Opera 11.0 — regardless of the CSS display property, they simply don’t parse correctly. For example, if you insert paragraph tags in the above example, it falls apart. Here’s an example. You get the correct result in WebKit, Firefox 4, and Opera 11.11:

WebKit screenshot

But you get this in Opera 11.0 and Firefox 3.6:

Opera screenshot

Upvotes: 2

Egor Kloos
Egor Kloos

Reputation: 65

If you really need to test the HTML5 output in Firefox (I can't imagine why) you could activate it through "about:config" and setting html5.enable to true. Remember that they didn't switch it off for nothing. For real world work you will need CSS, so I suggest you get stuck in with that as well.

Upvotes: 0

Related Questions