Using different stylesheet for handheld

[WhitePhantom]

Hi,

I've created a website which is displaying fine on a computer screen. However I want to reduce the size of some of the text when it's being displayed on a handheld device.

I've created a new stylesheet, and copied in one of the divs relating to the section I want to change. In my new stylesheet, I've specified a different font size (also a different font colour, for testing purposes.)

I've now got two lines in my code for linking stylesheets - one that doesn't specify any media type, and the second that specifies media=handheld. I presume where there's any conflicting settings, the second stylesheet will take precedence? ie. when it's displayed on a handheld, all the properties in the first stylesheet will be used, except where the same property has a different value in the second stylesheet?

This is not working however. I've uploaded my page, and uploaded the new stylesheet, but when I view it on the iPhone it's still using the font size and colour specified in the first stylesheet. I've refreshed, and cleared the cache, but to no avail.

Any idea why this is the case? Or what I need to do?

Many thanks,
J.

 

[louie]

You will be better trying to figure the browser version and load the right CSS file instead.
Also if you do that, you can create a new version of your website for mobile only and totally redirect.