I try to adjust the height of a div, based on the height of another div. Looks quite simple.. But unfortunately, it does not work. So please give me a hand in this. Here is my code:
anderblokhoogte = document.getElementById('slider-gaea');
var curblok = document.getElementById('curiculum');
curblok.clientHeight = anderblokhoogte.clientHeight + 'px !important';
I proved the element 'slider-gaea' exists, but the clientHeight of 'anderblokhoogte' differs from the height I see when inspecting this element. But also, the adjustment of the curblok.clientHeight does not give a change in height of the target element.
I already tried quite some options (other properties like 'style.height', 'offsetHeight') but no idea what mistake I make.
anderblokhoogte = document.getElementById('slider-gaea');
var curblok = document.getElementById('curiculum');
document.getElementById('curiculum').style.height = anderblokhoogte.clientHeight + 'px';<div id="slider-gaea" style="height:100px;"> First Div Block </div>
<div id="curiculum"> Second Div Block</div>You cannot set height using .clientHeight instead use .style.height and you need to lose the !important at the end as well.
Element.clientHeight is a read-only property.
Note: While HTMLElement.style is also a read-only property, it is possible to set an inline style by assigning a string directly to the style property (see example above).