Posts tagged MediaQueries

  1. Cross Browser Retina/High Resolution Media Queries

  2. Stop designing for fixed viewports!

    A reminder to let content, not device widths, determine breakpoints in responsive designs.

  3. IE10 Snap Mode and Responsive Design

    In Windows 8, there are two “modes” of use: Metro mode and classic mode. Metro mode sports the spiffy new UI while classic is the same old boring Windows of yore. When you run Internet Explorer 10 in Metro mode (the default) there’s a cool new feature that lets you “snap” a window to the side so you can use two simultaneously. This window, of course, is made to be far more narrow.

    Tim Kadlec beautifully explains how to get responsive layouts looking good in Windows 8’s Snap Mode.

  4. Nesting media queries

    Stephen Hay (@stephenhay) discusses nesting media queries within each other.

  5. The Thing About Those Media Types

    Great thoughts about CSS media types and media queries

  6. High-Resolution Media Queries

    Chris Coyier lays out some resolution-specific media queries. 

  7. Media Query Splitting

    Simurai looks at a technique of separating small and large screen styles to avoid having to override rules for larger screens.

  8. How do you pick responsive images breakpoints?

    Jason Grisby on setting image breakpoints independently to layout breakpoints. 

  9. Towards a Retina Web

    Some nice tips and techniques on creating resolution-independent web experiences.

  10. Determining breakpoints for a responsive design

    An excellent excerpt from Tim Kadlec’s book Implementing Responsive Design, which describes why it’s important to let content, not device widths, determine breakpoints.

  11. Debugging CSS Media Queries

    A nice little technique to help with debugging your CSS and determining which media queries have fired. 

  12. Where And How To Set Breakpoints In Media Queries

    A good read about how to go about setting breakpoints in responsive designs. It includes the important considerations such as letting the content, not device widths to determine breakpoints and to use relative units instead of pixels to set breakpoints.

  13. W3C Looks to Improve Responsive Design with New Media Queries

  14. Media Queries, Sass 3.2, and CodeKit

    A great look at what you can do with Sass 3.2 and media queries.

  15. Fashion Flipbook Created with Media Queries

    Mike Soloman (@solomania) came up with a super creative use for media queries. Of course a media-query-only flipbook isn’t the most practical thing in the world, but the outside-the-box thinking is totally awesome.

Back to Top