I am using the following to target iphones, and handheld devices to use specific mobile styles sheets but the Blackberry browers is picking up only the regular screen style sheets.
<link media="handheld, only screen and (max-device-width: 320px)" href="mobile.css" type="text/css" rel="stylesheet" />
<link media="only screen and (max-device-width: 480px)" href="mobile.css" type="text/css" rel="stylesheet" />
All the other mobile devices I've tested the site on are picking up the correct style sheets.
Does anyone know a way to target the Blackberry browser to do the same?
Thanks!
The state of mobile browsers is such a mess at the moment that I would not recommend trying to detect versions in the client. The most reliable way to do it is to use something like WURFL http://wurfl.sourceforge.net/ and do all your checking server side.
Good luck getting anything working nicely on the blackberry! Oh and don't forget to that the carriers might be screwing with your HTML before it even gets to the phone.
I ended up using Javascript to detect user agents.
Then printing mobile.css for handheld and screen if it is a mobile device (because the BlackBerry and iPhone think they are screens) and printing the regular style sheets if it isn't a mobile device.
It doesn't work for any device that doesn't have Javascript but they are probably better off seeing the bare bones version of the site anyway.
I don't have an exact answer and have never tried this myself, but you might try checking out the Mobile Device Browser File. This is targeted at ASP.Net developers working on mobile apps, however may still prove useful if you're not. Its open source and licensed under the MS-PL.
If you are using ASP.Net try checking out this podcast from Scott Hanselman for more info on the MDBF - ASP.Net and the Mobile Web
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With