0

I have a div container class with a width of 15%. Inside these containers I have image, the image has a a width of 100%. The problem is that not every image has the same ratio, so some container divs are longer then others which cause my layout to "crack".

Is there a way to resize all the divs to the size of the tallest div?

Peter Boomsma
  • 8,851
  • 16
  • 93
  • 185

1 Answers1

1

Loop through your divs using javascript find the max width. Then loop back through all the divs and set each width to the maxwidth that you found.

brso05
  • 13,142
  • 2
  • 21
  • 40
  • Thanks, your suggestion let me to http://stackoverflow.com/questions/6781031/use-jquery-css-to-find-the-tallest-of-all-elements and fixed it for me. – Peter Boomsma Oct 30 '14 at 20:28
  • Although, there's a "bug" in that code. When you resize the browser that height of the elements stays the same. I've update the fiddle, maybe you can check it out quick? > http://jsfiddle.net/76Rsh/64/ I guess the resize function doesn't do much because all the elements are the same height. – Peter Boomsma Oct 30 '14 at 20:43
  • Looks like the first stackoverflow post was a bit old. This topic is a bit fresher and has a responsive solution > http://stackoverflow.com/questions/19437476/equal-height-divs-or-li-in-rows-with-fluid-width-and-height-90-finished – Peter Boomsma Oct 30 '14 at 20:55