Comments on: iPad Orientation CSS

By: Garmahis

Garmahis — Tue, 01 Jun 2010 21:27:40 +0000

This post is featured on 40 iPad tools, tips for designer

By: Matthew James Taylor

Matthew James Taylor — Sat, 29 May 2010 00:01:52 +0000

This is such a useful post.

I used your orientation CSS to build an iPad CSS layout that changes the layout in portrait/landscape modes. You can see it here:
http://matthewjamestaylor.com/demos/ipad-css-layout/index.html

By: Scrivere CSS per iPad | Mr.Webmaster – Blog

Scrivere CSS per iPad | Mr.Webmaster – Blog — Wed, 12 May 2010 16:17:40 +0000

[...] L’adattamento consiste in pratica nella creazione di due differenti fogli di stile CSS: [...]

By: 5 More Resources for iPad Design and Development | ChurchDrop

5 More Resources for iPad Design and Development | ChurchDrop — Mon, 26 Apr 2010 17:08:16 +0000

[...] is a keeper and covers some good reminders in terms of iPad design.2. CSS Orientation:This quick resource shows how to use CSS media query to make sure the site orients properly.3. Apple’s Official Development Starter Kit:This is a [...]

By: Get Your Website Rockin’ Like Elvis on the iPad | CRAIG ALLAN TEICH

Get Your Website Rockin’ Like Elvis on the iPad | CRAIG ALLAN TEICH — Tue, 20 Apr 2010 21:41:44 +0000

[...] iPad Orientation CSS from Cloud Four describes how you can use different stylesheets depending on orientation [...]

By: Does Your Website Play Nicely with Apple’s iPad? It Better! | LaunchBox Pro

Tue, 20 Apr 2010 17:53:20 +0000

[...] iPad Orientation CSS from Cloud Four describes how you can use different stylesheets depending on orientation [...]

By: mytos.mykonos

mytos.mykonos — Thu, 15 Apr 2010 07:34:03 +0000

you can already do this on iPhone for a while… using Javascript just comparing width vs height in JS and add a “orient=”landscape” classname to the body tag when needed. Then you can easily manage both in the same CSS file (easier for editing/maintaining!) using body > div and body['orient:landscape'] > div.

And it just works for all browsers (iPhone, Droid, Wimo, BB, Palm, N900, …)

By: Designing for the iPad | 8164.org

Designing for the iPad | 8164.org — Mon, 12 Apr 2010 11:57:06 +0000

[...] Grigsby has a simple demo page to display different CSS styling depending on the [...]

By: Ryan

Ryan — Sun, 11 Apr 2010 23:56:06 +0000

Nice, I did some investigation on doing pure CSS orientation detection for the iPhone a while back. This definitely means the next firmware release will have this for the iPhone as well, finally.

By: Landscape vs. Portrait.

Landscape vs. Portrait. — Sun, 11 Apr 2010 14:01:40 +0000

[...] iPad allows for landscape- or portrait-specific CSS declarations. Useful, as there already seems to be a UI design convention emerging based on device orientation. [...]