Sometimes, we want to expand a parent div to the height of its children with CSS.
In this article, we’ll look at how to expand a parent div to the height of its children with CSS.
How to expand a parent div to the height of its children with CSS?
To expand a parent div to the height of its children with CSS, we set the parent div’s height
of the div to max-content
.
For instance, we add some elements with
<body>
<div id="parent">
<div id="childRightCol">/*Content*/</div>
<div id="childLeftCol">/*Content*/</div>
</div>
</body>
Then we write
#parent {
height: max-content;
}
to make the div with ID parent’s height max-content
to make it fit to the body.
Conclusion
To expand a parent div to the height of its children with CSS, we set the parent div’s height
of the div to max-content
.