Get a free trial // Grow your CSS skills // Land your dream job

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

    It is using css media queries. See – [Responsive design]( “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

    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