Css div sets the minimum height and adaptive height

Basin friends who often use div layout should have such experience, and this is not uncommon: there is a div, when the content inside it exceeds its height, make the height of the div automatically change with the content (adaptive), but if the content is very small, we want to keep the height of the div a fixed minimum value. This is the problem. We all know that, when the height (or height: auto) is not set in IE7, IE8, Firefox, Opera, and chrome, the height of the div is adaptive, but if the height is set, the excess part is automatically hidden (overflow: hidden), but IE6 does not take this one. Even if the height is set, the content will be automatically opened when it exceeds its height.

Now, we assume that the height of the div is 240 pixels. In this case, we can use:

. Mydiv {
Height: auto! Important;
Height: 240px;
Min-height: 240px
}
Note:
IE6 cannot recognize height: auto! Important and min-height: 240px, so its height is 240px. As mentioned earlier, when the IE6 content exceeds the limit, the height of the div will change with the page (adaptive) of the content ), IE7, Firefox, Opera, and Chrome can recognize height: auto! Important. Pay attention to this! Important's priority in CSS is higher than the following height: 240px, so it only accepts the height: auto in the rendering result! Important and min-height: 240px can be understood as height: auto, min-height: 240px. That's simple.