Reputation: 13499
I have the following HTML and CSS :
<div id="a">
</div>
#a {
width: 100%;
height: 700px;
background-color: orange;
}
jsfiddle :
https://jsfiddle.net/9zwsk6bb/
I would like the height to fill the total height exactly of the outer panel without using something like flexbox. Is it possible in this case?
Upvotes: 1
Views: 54
Reputation: 157314
Sure, but for that, you need to set the parent elements height
, because when you want the element's height
to be 100%
of the parent, then 100% of what? So, you need to have something like
html,
body {
height: 100%;
}
#a {
width: 100%;
height: 100%;
background-color: orange;
}
<div id="a"></div>
Note that if you have a wrapper element for #a
, then you need to set some height
for that element as well.
Upvotes: 2