两个DIV,左DIV宽度固定,右DIV自动填满剩余空间

来源:互联网 发布:java工程师就业前景 编辑:程序博客网 时间:2024/06/05 18:40

两个DIV,左DIV宽度固定,右DIV自动填满剩余空间


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>无标题文档</title><style type="text/css">#top,#bottom{clear:both;width:100%;height:auto;padding:10px 0;background-color:#0099FF;}#main{_width:100%;height:auto;overflow:hidden;padding:0;padding-left:200px;color:#000000;}#leftpart,#midpart{height:auto;margin-bottom:-32767px;padding-bottom:32767px;}#midpart{float:right;width:100%;background-color:#00CC99;}#leftpart{_display:inline;float:left;width:200px;margin-left:-200px;padding-top:30px;background-color:#999900;}</style></head><body><div id="top">top</div><div id="main"><div id="midpart"><p>主要内容部分,宽高自适应。</p></div><div id="leftpart"><p>左栏宽200像素,高度自适应。</p></div></div><div id="bottom">bottom</div></body></html>


0 0