Closed (won't fix)
Project:
HTML5
Version:
6.x-1.1
Component:
Code
Priority:
Normal
Category:
Bug report
Assigned:
Reporter:
Created:
5 Oct 2010 at 01:49 UTC
Updated:
8 Aug 2011 at 06:13 UTC
Jump to comment: Most recent file
I have html5.module enabled with the following IE Shiv target entities: abbr,article,aside,audio,canvas,datalist,details,dialog,eventsource,figure,footer,header,hgroup,mark,menu,meter,nav,output,progress,section,time,video
When I open the website in IE8, none of my HTML5 elements are displaying. More precisely, the DIVs and other standard elements withing the HTML5 elements are still showing up, but IE is acting like the HTML5 wrapper tags don't exist. None of the CSS targeting those HTML5 elements is having any effect. Am I missing something?
| Comment | File | Size | Author |
|---|---|---|---|
| #2 | screen-shot_html5-settings.png | 25.59 KB | jstoller |
| #2 | screen-shot_page-in-safari.png | 92.06 KB | jstoller |
| #2 | screen-shot_page-in-ie.png | 63.57 KB | jstoller |
| #2 | screen-shot_ie-developer-tools.png | 59.39 KB | jstoller |
Comments
Comment #1
heylookalive commentedHi, sorry to hear that!
Is your code online? If so could you provide a link to it, also a screenshot of the HTML5 module setting page if possible.
I just did a basic test of the module with a vanilla install of Drupal and it seems to be working fine, have you tried running your markup through the W3C validator as this does a fair job of noticing unclosed elements and the like.
http://validator.w3.org/#validate_by_input
Comment #2
jstollerI ran my code through the validator and, though it did find a couple small errors, even when I fixed the bugs it still wouldn't work. Attached are screen-shots of:
Notice in the developer tools that IE shows header, nav and footer elements in the code, but it doesn't recognize them as valid containers. You'll also notice that it sees the CSS targeting my #header ID, but it doesn't acknowledge any CSS targeting the header element directly. When I look at the Layout tab of IE's developer tools, it shows these elements as having no dimension, even though I've explicitly defined a width and height in the CSS.
Here's the HTML output for this page:
Comment #3
heylookalive commentedFrom your page output that you're missing the IE specific code which fixes the element support which is tacked onto the end of the $scripts variable which you'd use in your theme page template (page.tpl.php). Which looks like:
Are you modifying this variable at all? Could you post your page.tpl.php.
Comment #4
jstollerHere's my page.tpl.php. The $scripts variable is printed in <head>, as expected.
Comment #5
jstollerIn case it's an issue, here's a list of every module currently enabled on the site.
Comment #6
heylookalive commentedAfter some research I've found that the jQuery update module makes itself the last module to run preprocess page, specifically to alter the $scripts variable which html5 uses to append the conditional Javascript for IE.
As a temporary fix you can add the following code to your page templates after the scripts variable, in the head tag:
I'm currently working on a fix for this.
Comment #7
jacineHello, This project is now being used by the official HTML5 Initiative, so this issue is no longer valid. See the project page for more information.