Css 获取封闭flex容器的正确高度_Css_Reactjs_Dom_Height_Inline Styles

Css 获取封闭flex容器的正确高度

css reactjs dom

Css 获取封闭flex容器的正确高度,css,reactjs,dom,height,inline-styles,Css,Reactjs,Dom,Height,Inline Styles,我正在尝试向React中的现有网页添加div。如果视口是静态的，这没有问题，但是我需要允许对视口和更小的设备进行更改我有一个由flexbox组成的标题，flexbox中也有各种组件。为了确保新div放在正确的位置，我正在获取封闭容器的高度： const headerAssembly = document.getElementById('HeaderEnclosingContainer'); const headerHeight = (headerAssembly.clientHeight);

我正在尝试向React中的现有网页添加div。如果视口是静态的，这没有问题，但是我需要允许对视口和更小的设备进行更改

我有一个由flexbox组成的标题，flexbox中也有各种组件。为了确保新div放在正确的位置，我正在获取封闭容器的高度：

const headerAssembly = document.getElementById('HeaderEnclosingContainer');
const headerHeight = (headerAssembly.clientHeight);

对于静态页面，新div的正确顶部边距为304px，但现有容器的返回高度为335px。这留下了一个我不想要的缺口。如果我拉伸视口的宽度，正确的边距是210px，但报告的高度是249px。它似乎总是高估了现有集装箱的高度

我正在使用Chrome浏览器