On 27/12/2010 1:27 PM, David Laakso wrote:
On 12/26/10 9:05 PM, Philippe Wittenbergh wrote:
On Dec 27, 2010, at 10:41 AM, David Laakso wrote:
You can chain multiple mq's with 'and':
@media screen and (-webkit-min-device-pixel-ratio: 1.5) and
(max-width: 480px) { /* style */ }
example that works in desktop webkit:
http://dev.l-c-n.com/_temp/mq35.html
Philippe
Hmm. Therein lies my confusion. Dare I try [yikes, what a mouthful] ???
@media only screen and (max-width: 480px), only screen and
(max-device-width: 480px)
and @media only screen and (-webkit-min-device-pixel-ratio : 1.5), only
screen and (min-device-pixel-ratio : 1.5) {
/* Styles A */
}
Thanks,
Quasimodo
Juts like Philippe said by using "and" to chain the media queries
together. Drop the ", only screen" part. Something like this.
@media only screen and (max-width: 480px) and (max-device-width: 480px)
and (-webkit-min-device-pixel-ratio : 1.5) and (min-device-pixel-ratio :
1.5) {
/* Styles A */
}
I may also be missing something but I don't see device-width here.
<http://dev.w3.org/csswg/css3-mediaqueries/>
I have tried to search Apple developers and have come across
'device-width' but no 'device-pixel' nor 'device-pixel-ratio'.
<http://developer.apple.com/library/safari/#documentation/appleapplications/reference/safariwebcontent/OptimizingforSafarioniPhone/OptimizingforSafarioniPhone.html>
--
Alan http://css-class.com/
Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
______________________________________________________________________
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
