The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Implementing an SVG Icon System" Nov 30 - 6:00 PM Eastern

Scaffolding Images

  • # January 10, 2013 at 12:53 pm


    I was wanting to know how this effect was achieved across this website. The images jump and resize (pop) to a defined size when the browser size changes.

    Any ideas on how this is achieved, I’m hoping to implement something like this. Greatly appreciated!


    # January 10, 2013 at 1:31 pm

    This reply has been reported for inappropriate content.

    It is using css media queries. See – Responsive design

    # January 10, 2013 at 2:22 pm

    Thanks for pointing me in the right direction!

    So basically it’s just defining properties in the css within various media queries:


    @media only screen and (min-width: 960px) {

    .box { width:720px; }


    # January 11, 2013 at 1:58 pm

    This reply has been reported for inappropriate content.

    Yes it is. CSS specifically for the width of the browser!

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed