2005-09-28

Problem hiding Blogger navbar in Firefox using strict XHTML

Blogger added some more lines to the block of HTML which is used for the navbar. When you use my XHTML strict safe hack to hide this navbar, you'll get the CDATA close tag the top of your page when you are using Firefox:

]]>

Somehow the new lines of HTML break the Firefox parser. The page's source is highlighted correctly strange enough.

There is a way to hide the CDATA close tag in this situation. Replace the existing hiding code:

<body>
<div class="hide"><![CDATA[<body>]]></div>

with:

<body>
<div class="hide">
<script type="text/javascript">
//<![CDATA[
/* <body> */
//]]>
</script>
</div>

Down side is that it will leave you with two Javascript errors. So it is far from perfect. And, yes, I know my site does not validate at the moment. Some time ago I thought it was a good idea to switch to HTML 4.01 strict which apparently was not. You will need XHTML to use this CDATA trick. I will convert my template back to XHTML soon.

Check Testvulsel to see this trick working. Testvulsel will validate as XHTML 1.0 strict.

4 comments:

Brennan said...

I used < span > tags instead. You can check out my blog :)

Jasper said...

The span tag is not allowed at that point of the document. See error 1 of the W3C validation of your blog. I wanted my blog to be valid XHTML strict.

Mike said...

Another downside of this hack is that it will rip certain templates apart when used. This is what happened when I tried this on my blog. The easiest way to get rid of the end tag is to go into the template and delete the offending line. Works fine.

Jasper said...

When you delete that line it will no longer validate. Also, this code will not break any valid XHTML template. Are you using Internet Explorer without the extra CSS rule?