<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>左侧固定,右侧宽度100%自适应</title> <style type="text/css" media="screen"> <!-- body {margin:0;padding:0;} .right {margin-left:200px;} .left {width:200px;position:absolute;top:0;left:0;} p {border:solid #000 1px;padding:20px;} --> </style> </head> <body> <div class="left"> <p>左侧宽度200px</p> </div> <div class="right"> <p>右侧宽度100%</p> </div> </body> </html>
看了N篇文章,找了N中答案,什么clear啊,float啊,原来正道才是这么简单,而且100%兼容。Good!
对于右侧嵌入iframe, 则是<iframe width=" 100%" height="100%" src="http://www.baidu.com"></iframe> 兼容ie6 ff等等
但不能使用css指定iframe的width height,否则存在浏览器兼容问题