I'm working on this project:
http://bit.ly/tkrFsP
It already works more or less fine in: IE7, IE8, IE9, FF, Chrome, Safari and Opera.
Problems start when we try that in iPhone or iPad. iPhone works almost fine (except lags and AJAX/jQuery problems) but in iPad it has broken left navigation, wrongly re-sized thumbnails and it displays in half of the viewport. Also, there are problems with smoothness of jQuery animations and with AJAX unlike in other browsers on other devices (like PC). Any ideas on how to fix that? I've flicked through this:
1.
http://www.smashingmagazine.com/2010...tting-started/
2.
http://developer.apple.com/library/s...62/_index.html
It seems like a good place to start but there's many information on iPad/iPhone development on apple.com and their solutions don't fix my problems.
--------
More:
1. Anyone could outline here some basic code principles for iPad/iPhone?
2. Why project sub-page displays 5 times as large as it should on iPhone? Adding this: <meta name="viewport" content="width=device-width" /> doesn't help much and it even makes website work worse. Adding this: <meta name="viewport" content="maximum-scale=1,user-scalable=yes,width=960" > seems like a better solution but it's not perfect either.
3. How iPad's fixed containers work?
4. Why there's horizontal scroll appearing even with overflow-x: hidden?
Before you post, read our: 
