html - CSS3 Media Queries for targeting landscape on both iphone 4 and iPhone 5 sized sceens -
i having issue css3 media queries developing mobile site. code below works great on iphone 5 landscape, not on iphone 4 , below in landscape mode.
/* normal css represents portrait */ .test {width:100%;} /* flip landscape (working great on iphone 5) - not great on 4s , below */ @media screen , (orientation: landscape) { .test {width: 50%} }
now need keep above target iphone 4s , below in landscape mode, other devices around screen size.
can add media query target smaller screens keep styles above?
any great.
thanks
yeah, can target landscape on both using:
// iphone 5 @media screen , (orientation:landscape) { .test { width: 50% } } // iphone 4 , below, @danield's example @media screen , (min-device-width : 320px) , (max-device-width : 480px) , (orientation : landscape) { .test { width: 30% } }
where first iphone 5, , second iphone 4 , below. although, think second 1 should work both in itself. can't confirm since don't own 5.
Comments
Post a Comment