-3

I have 6 pictures on my web page listed in a row. Now when I resize the browser, everything gets smaller (Ratios don't change), but I want to keep my pictures as they are and just move them under each other when they run put of space.

So lets say after resizing, instead of having 6 pictures in a row, I want to have 3 pictures in 2 rows. All the way to make a column list for smaller devices, without changing the pictures dimensions.

Thanks in advance

Ardavan
  • 1
  • 2
  • There are a lot of ways to approach responsive design. For instance: https://stackoverflow.com/questions/11736363/responsive-images-with-css – tshimkus Jan 11 '19 at 19:03
  • Check out CSS flexbox https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox – Sam Walpole Jan 11 '19 at 19:04

1 Answers1

0

You should check out the bootstrap grid system, it does exactly that and much more! https://getbootstrap.com/docs/4.2/layout/grid/

wenzzzel
  • 643
  • 2
  • 6
  • 17
  • Welcome to Stack Overflow! While this link may answer the question, it is better to include some context and the essential parts of the answer here, then provide the link for reference. Link-only answers become invalid when the linked page changes or goes offline. See [How do I write a good answer?](https://stackoverflow.com/help/how-to-answer) for some more info. – Mark Ormesher Jan 11 '19 at 21:19