List of known differences between "Safari on iPad" and "Safari on iPhone"

iPhone and iPad use the same rendering engine, WebKit.

The only obvious differences between those platforms might be:

  • If font sizes on the site are specified in pixels, the retina display's higher DPI count might have some effect on text scaling, but I might be wrong. Always specify the font sizes in points.
  • Screen sizes of both devices are different. Not in terms of pixels, but in terms of physical size. This is something WebKit (or iOS in general) tries to compensate for by resizing fonts to make them readable while still fit on the page. This might lead to re-flowing the document; causing line-breaks.

For this case I can't really suggest anything else than checking your page layout. Validating it using W3C's tools and testing it properly in both Simulator and more importantly, on the devices.

From what it looks above, some CSS hacks (to make it work on IE for instance) might have an effect like this. Or a stray line break.

Generally, you shouldn't worry about differences between these two platforms, or platforms in general. Use clean CSS and HTML and test it on all target devices until it looks properly. Try to avoid using CSS/HTML hacks to make IE6 work. This is one of the root causes of problems from my experience.

As far as I know, there are no "major" differences between these devices, except for their screen size (and possibly the used WebKit/iOS version -- let's say iOS 3.x vs. iOS 4.2).

If you have access to Xcode, try to look at the site from different versions of iOS to see if that's the problem.

In either case. Fix your HTML and CSS. The problem might have a very simple cause.


Your iPad is probably running iOS 3.2 (or a beta of 4.2) while your iPhone is running at least iOS 4.0. That's more important than the differences between the platforms (of which there aren't supposed to be any).

I think you're barking up the wrong tree asking for a list of differences - you can go to http://trac.webkit.org/ and get an exhaustive list of patches and bug fixes between the two versions, but it's going to be quicker to just use normal CSS troubleshooting techniques (i.e. mostly trial and error) to figure out what about your site is causing it to mess up in iOS 3.2.