Inside the container block there are three blocks: left , main , right . The blocks have a fixed width, but their height depends on the filling of the main block, that is, on its height. The left and right blocks themselves are empty, which is what caused the problem.
<div id="container"> <div id="left"></div> <div id="main">text</div> <div id="right"></div> </div> Styles:
<style> #container{width:200px} #left{float:left;width:50px;height:100%} #right{float:right;width:50px;height:100%} #main{margin:0 50px} </style> With these styles, the left and right blocks are simply invisible. If these blocks are set to min-height , they do not acquire a height greater than this minimum height, ie the blocks remain at a fixed height:
How can you get rid of this problem and make the "dependence" of the height of the side blocks on the height of the middle block?
