HTML Logo by World Wide Web Consortium ( Click to learn more about our commitment to accessibility and standards.

Moving forward with Composr

ocPortal has been relaunched as Composr CMS, which is now in beta. ocPortal 9 will be superseded by Composr 10.

Head over to for our new site, and to our migration roadmap. Existing ocPortal member accounts have been mirrored.

HTML5 and iframes -- a mess

HTML5 and iframes -- a mess HTML5 removes the 'frameBorder' and 'scrolling' attributes for the iframe element. So in order to have a validating HTML5 document, you're not allowed to use them.

In theory, CSS can pick up the task instead, so the HTML5 changes makes sense on the surface. HTML5 also introduces a new 'seamless' attribute to achieve what most people are trying to achieve anyway.

However, it all goes down hill from here…

IE does not support changing them via CSS, either via setting styles on the iframe element or by setting styles on the html/body elements of the frame contents.

And, no browsers support the 'seamless' attribute yet (so next time you hear someone say Chrome or Firefox supports HTML5, remember they're misinformed – there are actually quite a few HTML5 features not supported by any browser yet).

The normal workaround would be to use Javascript to reinject them. Browsers implement the super-set of all HTML features they handle, there is no widespread limitation based on what HTML version you declare (just variations in behaviours according to version), so it should be possible to have a validating document, then to use Javascript to program buggy browsers like IE to see sense.
Unfortunately IE is so buggy you're not allowed to set 'frameBorder' or 'scrolling' after the iframe has rendered (you can do it for a new progmatically created iframe though).

One could progmatically re-generate the iframes, but that would result in the iframes double-loading, with pretty horrible consequences.

So the solution is missing: there is no choice but to produce invalid HTML5 if you want to support all browsers and use iframes.

Some might say iframes are a bad idea, but I think the opposite – if you need a small part of the page to work independently, you shouldn't (for accessibility reasons) rely on Javascript to manipulate it individually. I am reliably informed many (or all?) braille-readers do not run Javascript. Refreshing the whole page is not good either (it's also an accessibility issue, and just plain annoying).

So that kind of sucks, but in the end, validation is not the most important thing in the world. There's one simple trick we can use – only feed the invalid HTML to IE, via server-side detection. Then the compliant browsers and tools won't be tainted.

Another HTML5 problem…

IE (prior to version 9) will not understand CSS applied to tags it does not recognise, so you can't use the new HTML5 block-level tags because IE will default to them being inline and you can't style them with CSS. Fortunately there's a workaround:
HTML5 enabling script

View all


There have been no trackbacks yet