Saturday, September 08, 2007
Windows Mobile 2003 Internet Explorer and Style Sheets
I decided to start playing with my Dell Axim X3i that I bought a few years ago. It has WiFi built in, along with Bluetooth. I noticed that while some websites were fine, others were a complete mess, including my BunnyOne Design website. It looked like it was rendering a mix of the screen and handheld versions of my style sheets. I was so shocked at how awful it looked. I had viewed the website in Dreamweaver's mobile browser preview, and it looked fine there...
So, I decided to do a little investigation. It turns out that for some reason, Pocket Internet Explorer is designed to read screen style sheets, and not handheld style sheets. (At least the version included on my Axim.)
I saw on a forum that someone suggested capitalizing Screen as a way of tricking this version of IE into ignoring screen style sheets. When I tried it, it worked.
The Code
Change the link to your style sheet from this:
<link href="../CSS/screen.css" rel="stylesheet" type="text/css" media="screen" />
to
<link href="../CSS/screen.css" rel="stylesheet" type="text/css" media="Screen" />
This will make Pocket IE skip over your default screen style sheet, but at the same time allow desktop and laptop computers to access it normally.
