Ian Hoar — Passion for Technology – Geeking Out

I was dealing with this a few weeks ago and it took me awhile to figure out. I had a proper doctype and viewing the source code showed that everything was okay. I was trouble shooting the php html and css, but to no avail. I’d dealt with this issue once in the past, I was sure of it. Finally it hit me when looking through the drop-downs of Notepad++. It turned out to be the character encoding, or the BOM in the character coding to be precise.

If you are using a UTF-8 character encoding and the BOM (Byte-order mark) is included, it will cause Internet Explorer 6 or 7 to go into quirks mode. This can throw off your page rendering. The obvious signs are when your page is no longer centred or you have wacky padding which can cause the entire layout to be thrown out of whack.

In Dreamweaver you can go to Modify / Page Properties and then select Title/Encoding. If you have an encoding of Unicode (UTF-8) selected you should see a check box at the bottom that says “Include Unicode Signature (BOM)“. If this is checked, uncheck it. In notepad++, my text editor of choice, you can go to Format / Encode in UTF-8 without BOM. Other editors should also have an option similar somewhere to change the character encoding behaviour.

If this was the problem, then your page should now be rending with the appropriate doctype instead of quirks mode.

Leave a reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>


About

Ian HoarWelcome to the blog of Ian Hoar. I talk about current web trends, technology, toys, games, gadgets, design, usability and everything in between. It’s all about geeking out and an occasional rant. More about me

Get Social!
Most Recent tweets — Follow me on Twitter
Categories