iPhone Browser simulator for Windows?

iphone browser safari simulation
codeulike picture codeulike · Oct 7, 2010 · Viewed 82.1k times · Source

Note: This is a question about simulating the Browser on the iPhone, not simulating the whole device. I know that iPhone-device simulation is not possible on Windows, as discussed at length here.

I have a web site that looks really weird when viewed on an iPhone - its some sort of CSS issue.

The same issue does not occur when I view the site in Safari for Windows (or any other Windows browser for that matter).

So, are there any good iPhone Browser simulators that run on windows? I.e. that render a site in the same way that the iPhone browser does.

Bonus points if there's some way of inspecting the CSS in detail, as with Chrome's 'inspect element' developer feature.

edit: for the curious, the rendering problem that I'm trying to solve is described here: CSS background image rendering differently on iPhone

Answer

Robert Redmond picture Robert Redmond · Oct 7, 2010

You can simulate the iPhone user agent in Safari 5 if you set up the Developers menu item in Preferences>Advanced. The webkit engine in Safari 5 is similar to iPhone's browser so most of the HTML 5 stuff works the same. As a bonus the Developer's tab allows you to debug JavaScript and some CSS (not so well supported).

Related questions

Font size rendering inconsistencies on an iPhone

I’m testing my website and is working fine on every browser, except for the iphone browser (i think it’s mobile Safari?) that renders a piece of text with a bigger font that the rest. I’ve checked the …

Read More
jQuery on iPhone/Android/BlackBerry

I don't have any of the devices to test at the moment. I guess I'll start using the emulators later on. We're looking to offer mobile support. I was wondering how jQuery or even javascript renders in their respective browsers. …

Read More
Android viewport setting "user-scalable=no" breaks width / zoom level of viewport

I am working on a web app which has a width of 640px. In the document head I set <meta name="viewport" content = "width=640, user-scalable=no" /> so the content is nicely displayed and stretched horizontally. This works perfectly …

Read More