-1

my aim is to create a container that will contain boxes of different sizes(by input), the aim is to leave as little empty space as possible. I'm doing this with css and the question is, is there a better way than using "css-grid"? (yes, logic with JavaScript)

aledighema
  • 1
  • 1
  • I guess you need to investigate packing algorithms. Here’s a start: https://stackoverflow.com/questions/1213394/what-algorithm-can-be-used-for-packing-rectangles-of-different-sizes-into-the-sm – A Haworth Jun 14 '22 at 20:27
  • It sounds like you are looking for a Masonry Layout. There are various ways to achieve that. This is a nice article on some methods: [https://css-tricks.com/piecing-together-approaches-for-a-css-masonry-layout/](https://css-tricks.com/piecing-together-approaches-for-a-css-masonry-layout/) – Ali Klein Jun 14 '22 at 20:10

1 Answers1

0

Personally I tend to use display: flex with align-items: center and flex-direction: row

documentation
A complete guide.

rootShiv
  • 1,375
  • 2
  • 6
  • 21
Johannes Losch
  • 11
  • 6