I have what is essentially an offline web site embedded in a UIWebView. I've created a stylesheet to format everything nicely on the iPhone screen, but I need different formatting to take better advantage of the iPad's screen.

I tried using code to simply copy a different stylesheet into place, but this involves modifying the application bundle which is either discouraged or, in this case, just doesn't work.

Can anyone think of a way to have a different stylesheet loaded based on whether the app is running on the iPhone or iPad? I have thousands of HTML files which are synchronized with a web site so I can't very easily modify all of them. I need some way to change the stylesheet that gets loaded using javascript or by moving the css file into a certain location.

I should also mention that this is a universal application with almost the exact same code (and slightly different nib files) running on both.

I have what is essentially an offline web site embedded in a UIWebView. I've created a stylesheet to format everything nicely on the iPhone screen, but I need different formatting to take better advantage of the iPad's screen.

I tried using code to simply copy a different stylesheet into place, but this involves modifying the application bundle which is either discouraged or, in this case, just doesn't work.

Can anyone think of a way to have a different stylesheet loaded based on whether the app is running on the iPhone or iPad? I have thousands of HTML files which are synchronized with a web site so I can't very easily modify all of them. I need some way to change the stylesheet that gets loaded using javascript or by moving the css file into a certain location.

I should also mention that this is a universal application with almost the exact same code (and slightly different nib files) running on both.

• javascript
• iphone
• css
• ipad
• uiwebview

Share Improve this question Follow edited Oct 11, 2010 at 1:46 Nimrod asked Oct 11, 2010 at 1:41 NimrodNimrod 5,13311 gold badge2727 silver badges3939 bronze badges

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 3

Can you use a CSS media query? You could inject it into your pages using stringByEvaluatingJavaScriptFromString:.

Via your server side code, you could detect the iPad User Agent and write out a link tag to a different stylesheet. I would probably go with server side logic rather than Javascript, simply because I don't like the possibility of a "flicker" of doing this with Javascript.

Why dont you have a look at 960 Grid System http://960.gs . It helps to use different CSS formats based on the device it encounters