参考下面的代码：
<html>
<head>
<title>CSS全兼容根据内容自适应高度</title>
<style type="text/css">
<!--
.left{width:200pxfloat:leftbackground:#ccccolor:#993399min-height:100pxheight:auto !importantheight:100pxoverflow:visible}
.right{width:200pxfloat:leftbackground:#999color:#fffheight:100pxtext-align:right}
-->
</style>
</head>
<body>
<div class="left">有质量的学习型源代码资料站。</div>
</body>
</html>
您可以在火狐社区了解更多内容。希望我的回答对您有所帮助，如有疑问，欢迎继续在本平台咨询。
一、首先创建或打开我们的web项目并创建一个新的html文件和css文
二、HTML页面代码如图所示。定义一个div并给出一个id属性。
三、使用宽度百分比后，将高度值设置为零，使用padding属性的top或者bottom（可以使用任何百分比），并使用背景色作为测试。
四、浏览器运行后，效果如下。如果放大或缩小，宽度和高度将相应更改。
五、此方法是使用表达式设置高度。
这里需要用到只有IE能够识别的expression，实现方法请查看下边css代码：
/* 最小高度 */.min_height{
min-height:200px
/* sets min-height for IE */
_height:expression(this.scrollHeight < 200 ? "200px" : "auto")
}
/* 最大高度 */
.max_height{
max-height:400px
/* sets max-height for IE */
_height:expression(this.scrollHeight > 400 ? "400px" : "auto")
}
通过这个写法，也就可以得到延伸。比如最小宽度，最大宽度问题。
