overflow的另类用法
2008年4月16日
有人问这个问题：
左右布局，图片的宽度不固定。
正好前几天测试闭合浮动元素时发现了overflow的特殊现象，倒是正好可以用在这里。
测试通过：ie6/7 ff2.0 opera9.2 safari 3.0
不过这只是个原形，没有更严密地测试过。
我推测由于需要overflow:auto，因此浏览器会计算元素的实际宽度和高度，所以会有此现象。
<!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">
.photo {
float:left;
}
p {
zoom:1;
overflow:auto;
}
</style>
</head>
<body>
<div id="box">
<div class="photo"><img src="img/bg1.png" alt="img" /></div>
<p> 文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字</p>
</div>
</body>
</html>
