from Hacker News

Quickly check the CSS Media Queries that work with your device

by wasigh on 11/4/11, 4:00 PM with 8 comments

CSS media queries are a very powerful tool to create optimized web pages. But which CSS Media query should I use to target my device? This simple page helps to find the right media query.
  • by gcp on 11/4/11, 6:19 PM

    This seems to encourage the sort of thing CSS Media Queries are exactly made to prevent: trying to detect the device and make some special case code for that, instead of thinking about what is possible given the capabilities.

    It's also broken.

    The iPad queries should incorrectly trigger on some Android devices, the "SmartPhone" category will be outdated soon. And it fails to detect my desktop.

  • by gburt on 11/4/11, 6:10 PM

    It only detects iPad in portrait, not landscape... Is that correct?
  • by geuis on 11/4/11, 7:26 PM

    "Smartphones (portrait)" even though my iPhone is in landscape.
  • by FreeFull on 11/4/11, 6:49 PM

    Apparently my Thinkpad is an iPad in landscape mode now.
  • by sedev on 11/5/11, 3:45 AM

    There's no alt text for the images - as a result, when I visit in w3m, I can't actually see whether or not the site thinks I'm on a tty.
  • by nielsz on 11/4/11, 8:19 PM

    Thanks for all the feedback! I've resolved the iPad landscape error, will refactor some other mediaqueries in the coming days!
  • by Semiapies on 11/4/11, 7:32 PM

    It thinks my Droid is in landscape mode, even in portrait, and even if I refresh.
  • by rev087 on 11/4/11, 5:30 PM

    It seems to fail the iPad detection.