绝对定位的DIV宽度自动适应的一个方法


答案：刚刚在一个页面上用到了position:absolute; 

这样的代码在IE7和FIREFOX都不会有问题，但是在IE6以下的会不支持； 
<!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"><div style="position:absolute; background:#FF0033;  border:1px solid #996600; padding:20px 50px; top:250px; left:100px; right:100px;"> 
这是一个测试 
</div>

  [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

于是针对IE6我又加了一个<hr /> 这下可以了；
<!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"><div style="position:absolute; background:#FF0033; border:1px solid #996600; padding:20px 50px; top:250px; left:100px; right:100px;"> 
这是一个测试<hr /> 
</div>

  [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

但是hr我不想在页面上出现；于是加了一个b 

<!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"><div style="position:absolute; background:#FF0033;  border:1px solid #996600; padding:20px 50px; top:250px; left:100px; right:100px;"> 
这是一个测试<b style="float:right; height:0; overflow:hidden"></b> 
</div>

  [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

这是一种方法；是我实在不知道应该怎么处理这东西的一种方法；谁知道真正的方法是什么；麻烦告诉我一下； 

这是最后的效果； 
<!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"><div style="background: #FFFDEC;-moz-opacity:0.9; filter:alpha(opacity=90); position:absolute; border:1px dashed #999;  top:250px; padding:20px 50px; left:100px; right:100px; text-align: center; font-size:12px;"> 
这是一个测试 
<b style="float:right; height:0; overflow:hidden"></b> 
</div>

  [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
上一个：网页设计布局基础第1/4页
下一个：[转]目前找到的最好的Iframe自适应高度代码
更多图片编程知识: