第一次拿Opera、Safari调试页面（太无聊了，想给自己找点麻烦XD），果然，麻烦来了……例子是关于more的一个写法。一般的是用负上边距让more与标题在同一行上。测试代码：
<!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=utf-8" />
<title>负边距在Opera、Safari中的表现 www.etosun.cn</title>
<style type="text/css">
<!--
body {font-size:12px;}
.a {margin:auto;width:600px;height:30px;line-height:30px;text-indent:10px;background:red}
.a span{float:right;height:30px;line-height:30px;width:60px;text-align:center;background:yellow}
-->
</style>
</head>
<body>
<div class="a">标题<span>more</span></div>
</body>
</html>
调试结果：
在没有上负上边距时Opera、Safari下more居然能跟标题站在同一行，看起来好搞笑。赶紧改下写法：
<!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=utf-8" />
<title>负边距在Opera、Safari中的表现 www.etosun.cn</title>
<style type="text/css">
<!--
* {margin:0px;padding:0px;}
body {font-size:12px;}
.a {margin:auto;width:400px;line-height:30px;background:red}
h3 {float:left;height:30px;width:340px;line-height:30px;background:#0099FF}
.a span{float:right;height:30px;line-height:30px;width:60px;text-align:center;background:yellow}
ul {clear:both;margin:auto;padding:20px;width:340px;background:#00FF00}
-->
</style>
</head>
<body>
<div class="a">
<h3>标题</h3><span>more</span>
<ul>
<li>列表</li>
<li>列表</li>
<li>列表</li>
</ul>
</div>
</body>
</html>
