HOWTO: CSS for the iPad [Update]


March 4th, 2010 in Apple, Mac, Tip, Web design | 11384 reads

The iPad is coming and the developers already received the iPhone Simulator Extension. The new XCode beta also includes Safari Mobile.

If you want to use a CSS modification for the iPad (as I do), this is how you tell the iPad to use an additional CSS file:

<link rel="stylesheet" media="only screen and (max-device-width: 1024px)" href="../ipad.css" type="text/css" />

Because of the other browsers not knowing how to handle this type of media string they won’t interpret it. The ipad.css will be interpreted by the iPhone, too. So if you need some specific CSS also for the iPhone, you proceed equally but with max-device-width: 480px.

Update

This site shows how to implement the rotation mode (portrait or landscape).


to top