JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrapper">
  <div id="elements">
    <div class="negate"></div>
    <div class="element"></div>
    <div class="element"></div>
    <div class="element"></div>
    <div class="element"></div>
  </div>
</div>

CSS

#elements {
  width: 400px;
  height: 200px;
  border: 2px solid black;
}

.element {
  width: 200px;
  height: 100px;
  float: left;
  border: 2px solid black;
  box-sizing: border-box;
}

.negate {
  background: 
    linear-gradient(to top left,
      rgba(255, 0, 0, 0) 0%, 
      rgba(255, 0, 0, 0) calc(50% - 3px), 
      rgba(255, 0, 0, 1) 50%, 
      rgba(255, 0, 0, 0) calc(50% + 3px), 
      rgba(255, 0, 0, 0) 100%);
  width: inherit;
  height: inherit;
  position: absolute;
}

JavaScript

var body = $('#wrapper').height();
alert(body);