What you're asking is more of a "make my div block have the full window or parentDOMElement height" than "how to make ReactComponent have the full window or parentDOMElement height".
Here's a post that explains this: CSS - Expand float child DIV height to parent's height
The gist of it is that the parent element's position
needs to be relative
. Then, the child (i.e. the element you're trying to make have a height of 100% of its container) will actually have a height
of 100% of its container.
Here's a demo:
<body>
<div id="title"></div>
<div class="parent">
<div class="child">
Hi, I am a child
</div>
</div>
</body>
<style type="text/css">
.parent {
position: relative;
background-color: rgba(50, 70, 200, 0.3);
width: 100%;
height: 200px;
}
.child {
height: 100%;
background-color: rgba(50, 70, 200, 0.3);
}
</style>
With that, you just need to Render your React component inside of the .parent
div and should work.