h5bp / mobile-boilerplate

DEPRECATED - A front-end template that helps you build fast, modern mobile web apps.
MIT License
3.86k stars 649 forks source link

Targeting landscape for iphones properly #9

Closed johnnycadelco closed 13 years ago

johnnycadelco commented 13 years ago

Shichuan,

To target landscape view in iphones you're currently using: @media only screen and (min-width : 321px). This is an actual mobile template but if you guys decide to merge with an html/mobile, the following MQ is the proper way to target landscape:

@media only screen and (min-width: 321px) and (max-device-width: 480px)

The reason is min-width by itself will take effect in regular browsers and adding that max-device-width will fix that.

Cheers!

chuanxshi commented 13 years ago

hey johnnycadelco, this is a nice idea.

It is now changed at: cdc7f3a8b27b382754f639ca4500d7682843aa17

although we won't merge mobile w desktop version, but i think it's good to add this, cos it makes the stylesheet more mobile specific, leave space for people who are into mobile first idea.

thanks!

johnnycadelco commented 13 years ago

niceee, thanks!