I’ve been working with two stylesheets, one for devices bigger than 480px which would be people browsing on a computer. And one stylesheet that gets called if the screen resolution is smaller, which would be mobile devices, specifically for iPhone and iTouch.

These pages look best in the following order Safari then Firefox. Opera and iExplorer last. Click on the next page to see screendumps from each browser.

Safari 3.12 (as it should look)

Firefox 3.01 (missing the glow effect on headers)

Opera 9.20 (also missing the rounded corners in headers)

iExplorer 7 (looks similar to Opera, the menu (not showed here) looks weird and needs more tweaking)

This is how it looks with Safari on the iPhone

It would be interesting to see screendumps from other browsers, especially phones. Please send it to us!