Use CSS3 Media Queries To Create Mobile Version of Your Website
I read an excellent article highlighting how to create iPhone, Android and iPad–friendly versions of your website.
This is achieved with CSS3 media queries, either in your main stylesheet or using a seperate stylesheet.
The key point is that you can simply add the following code to the bottom of your main stylesheet:
@media only screen and (max-device-width: 480px) {
/* Add iPhone styles here */
}
Or you can refer to an external stylesheet below your main stylesheet as follows:
<link rel="stylesheet" type="text/css" media="only screen and (max-device-width: 480px)" href="http://www.example.com/css/mobile.css" />
Read the full article here: How To Use CSS3 Media Queries To Create a Mobile Version of Your Website – Smashing Magazine