Ismail Farooq Ismail Farooq - 16 days ago 6
CSS Question

Equal height with auto width collage

I am try to make something like the following image.

Auto Width collage

The image size can be any size but max height should be 68px

I have tried

table-cell
but i am not able to break the row.

I have also use column-count but not get sucess is it possible with css ?

Need help Thanks

Answer

Flexbox is perfect for this, just add this css to the parent of the pictures:

display: flex;
flex-direction: row;
flex-wrap: wrap;

You can set the flex-grow of the children to 1 to stretch them over the whole parent. See the example I made for you:
https://jsfiddle.net/u4cxqab1/

Here is some more documentation about flexbox:
https://css-tricks.com/snippets/css/a-guide-to-flexbox/