一个css问题

php_way 2014-09-30 09:23:58

<!DOCTYPE>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />

<title>html页面</title>

<style>

*{padding: 0;margin: 0}

#main{width:auto;height: auto;background-color: #ccc;position: relative;padding: 20px;}

#left{position: absolute;width: 300px;height: 500px;background-color: blue;}

#right{margin: 0 0 0 330px;background-color: yellow;}

#footer{width: auto;height: 100px;background-color: orange;text-align: center;}

</style>

</head>

<body>

<div id='main'>

	<div id="left">左边</div>

	<div id="right">右边</div>

</div>

<div id="footer">底部</div>

</body>

</html>

问题是：footer怎么样下沉到最底部
我想要达到的效果是：
-----“右边"高度和宽度自适应，窗口变化时自动跟着变化

...全文

104 2 打赏收藏转发到动态举报

写回复

用AI写文章

2 条回复

切换为时间正序

请发表友善的回复…

发表回复

php_way 2014-09-30

打赏
举报

谢谢楼上的兄弟，已经用另外的方法解决了

<!DOCTYPE>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>html页面</title>
<style>
*{padding: 0;margin: 0}
#main{width:auto;height: auto;background-color: #ccc;padding: 20px;overflow: auto;}
#left{float:left;width: 300px;height: 500px;background-color: blue;position: relative;}
#right{background-color: yellow;margin-left: 330px;}
#footer{width: auto;height: 100px;background-color: orange;text-align: center;clear:both;}
</style>
</head>
<body>
<div id='main'>
	<div id="left">左边</div>
	<div id="right">右边</div>
</div>

<div id="footer">底部</div>
</body>
</html>