I want to make my children div take the remaining space of the screen and disable the scrolling option, because I'm using PanZoom, I want the children's div to be always 100& the screen
<div class="parent">
<menu> ... </menu>
<div class="children">
<panzoom></panzoom> //the image can change size, height etc.
</div>
</div>
I tried to use
children {
height : 100%
}
But with PanZoom, the div is bigger and the scroll option apears.
I'm honestly not sure exactly what you mean, your question is a little unclear, but, here's a possible answer.
If you want to make an element truly full-screen, you shouldn't just set the height to 100%, you need to consider the user's screen, like so:
.element {
height: 100vh; // sets the height to the full screen view height
width: 100vw; // sets the width to the full screen view width
overflow: hidden; // hides scrolling
}
If you don't want the scrollbar to appear you can do
.children {
overflow: hidden;
}