Makes two div equal size

Question

I have a row of section like so: enter image description here

And I'm trying to make the second div follow the same height as the first one, notice that the height depends on the picture size, that can change. Do you have any idea?

Possible duplicate of [How do I keep two divs that are side by side the same height?](https://stackoverflow.com/questions/2997767/how-do-i-keep-two-divs-that-are-side-by-side-the-same-height) — niceman, Jun 13 '17 at 21:37

score 0 · Answer 1 · answered Jun 13 '17 at 21:27

0

try using javascript to get the div height when it change

var divt= document.getElementById('myDiv').clientHeight;

and then set it to equal the other div height

answered Jun 13 '17 at 21:27

fcddfx

1
3

Wont it be easy if he gives a fixed width and height in css instead of handling it using javascript ? – ISHIDA Jun 13 '17 at 21:33
well if the size of the picture is not fixed it wont hekp puttinga fixed size in css:/ – fcddfx Jun 13 '17 at 21:41
I tryed with document.getElementById('chartdiv').style.height = '200px'; but it doesen't work , I insert in inside an windows onload event – Solber Jun 13 '17 at 22:55

score 0 · Accepted Answer · edited Mar 23 '18 at 06:42

If you are open to using jQuery, this is really simple. Simply give both divs the same class and then copy the following code to the bottom of your page before the </body> and place between <script></script>.

    $(function() {
        $('.myClass').matchHeight();
    });

However, there are two other steps that can't be overlooked.

include jQuery
include jquery.matchHeight.js (you can download at: https://github.com/liabru/jquery-match-height)

This is a responsive solution that will allow you to not force the height of the image and allow the height to change with a responsive page.

Makes two div equal size

2 Answers2