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

Responsive CSS: filling all available width with images

  • # November 29, 2012 at 4:19 am


    I’m trying to make a responsive markup for a video gallery.
    Problem I’ve stumbled upon is illustrated by this example: (please don’t mind those side columns, they’re hidden when screen is too small using media queries) – here I’m trying to make video images to take all available space with text-align justify, but as you can see spacing in rows differs and last element can be aligned only to right (doesn’t look good :S).

    Seems that I’m doing something totally wrong. My question is: how should I implement middle column?

    I understand I can use a table with a bunch of media queries, but it seems to be overkill and I hope to find some more dynamic approach.


    # November 29, 2012 at 6:45 am

    Might be worth checking out Jquery Masonry.

    You could use CSS3 Columns, but browser support for older browsers is pants.

Viewing 2 posts - 1 through 2 (of 2 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