#content{
background-color: #FFFFBA;
border: 1px solid #FFCC66;
padding: 4px;
margin-bottom: 10px;
}
.left_right{
background-color:#FFDD99;
border:1px solid #FF9100;
padding: 0 3px;
size: 13px;
text-decoration: none;
}
<div id="content">
<span id="blog_tips_nav" style="float:right">
<a href="#" class="left_right"><</a>
<a href="#" class="left_right">></a>
</span>
小贴士: <span id="blog_tips"></span>
</div>
可以与下面的代码比较一下:
<div id="content">
小贴士: <span id="blog_tips"></span>
<span id="blog_tips_nav" style="float:right">
<a href="#" class="left_right"><</a>
<a href="#" class="left_right">></a>
</span>
</div>
注意先后顺序!
2中写法在FF中表现一致,但在IE中第2种方法会换行!!!
原因:当非float的元素和float的元素在一起的时候,如果非float元素在先,那么float的元素将被排斥
也就是说,你的span是float:right,但是你文本还是float:none