Summarised from the Smashing Magazine article. Because sometimes you just want the bare bones, not the explanation.
- Add in a mobile stylesheet:
<linkrel="stylesheet"type="text/css"media="only screen and (max-device-width: 480px)"href="small-device.css"
/>
If you want to use ProtoFluid (an excellent testing tool), use this one:
<link rel="stylesheet" type="text/css" media="only screen and (max-width: 480px), only screen and (max-device-width: 480px)" href="css/small-device.css"> - Add in the meta tag to help the iPhone out:
<metaname="viewport"content="width=device-width"/> - Redo styles!