Responsive CSS: filling all available width with images

[naquad]

Hi.

I’m trying to make a responsive markup for a video gallery.
Problem I’ve stumbled upon is illustrated by this example: http://codepen.io/anon/pen/IoyGt (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.

Thanks.

[Author]

Posts