Hey guys I could use some help on this issue.
Looking at a page I developed as part of a Wordpress theme I am writing and I noticed now as I decided to check the page on Firefox that the DOM is all screwed up. I can’t see why the same page, with the same source, would have 2 completely different looking DOM’s and FF’s just looks wrong. It might have something to do with the HTML5 elements I am using, but I am using HTML5 Boilerplate that includes Modernizr and I am talking about the latest FF here! Let me show you what I mean.
In Webkit (Chrome 8.0) it shows the DOM as intended:
+ div
|+ section
||+ hgroup
|||-h2
|||-h3
||+ article
||+ article
||+ article
The same page in Firefox (3.6.12) shows up like this (the last 2 articles are outside the section):
+ div
|+ section
||+ hgroup
|||-h2
|||-h3
||+ article
|+ article
|+ article
Is this a browser issue? It can’t be THAT bad at parsing a DOM, its the latest version of a major browser! Is there something I’ve done to cause this? How can the same source markup be interpreted differently like this?
Refer to this link to see the page with the issue: hosted locally so hopefully my machine is on
The issue is also occurring on other pages as well but this one makes it pretty clear.
UPDATE:
sorry for wasting ur time this was a pretty dumb mistake, i was missing a closing </p> tag, webkit seems to patch that up for you and firefox has an issue because of the malformed html. SORRY!