Rohan B Rohan B - 4 months ago 11
CSS Question

Cannot access element's style.height in JS

I'm trying to modify an elements height (elementTwo) using another element's height (elementOne) using JS (No jQuery)

When I try logging elementOne.style.height, I get an empty string
Using Safari and Chrome inspector's I can see the computed height but cannot access it using JS. It shows up as faded (See screenshots)

Screenshot of Safari inspector |
Screenshot of Chrome inspector

.elementOne {
min-height: 100vh;
width:100%;
}


ElementOne has a min-height set to be 100vh but automatically increases in size based on the device / size of child elements. It does not have a height set. ElementTwo does not have any css by default

I am trying to do this using JS only and do not want to use jQuery at all.

Answer

I think you want to use the property .clientHeight of the dom-element. See the mdn arcticle about it.

Comments