DEV Community 👩‍💻👨‍💻

DEV Community 👩‍💻👨‍💻 is a community of 963,864 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Faris Han
Faris Han

Posted on

Answering: How to adjust the 4th image column to make it a responsive image gallery

So, somebody asked about CSS flex-based image gallery.

He want to make a responsive image gallery with CSS' flex. Four columns on desktop and three columns around the tablet viewport.

I think the problem is in his HTML structure. So, I restructure it.

Check my answer below and please correct me if I'm wrong, or help him with better and clean-code solutions, maybe?

First of all, I think the HTML code is wrong, because you wrap four photos in a section and then want to 'kick out' one of the photos. They supposed to be divided to two or one, not three.

And the class naming system is not good enough (How…

Top comments (0)

Take a look at this:

Settings

Go to your customization settings to nudge your home feed to show content more relevant to your developer experience level. 🛠