元素 float:right 后右对齐换行原因

iteye_7414

于 2010-05-30 02:26:42 发布

阅读量134

点赞数

分类专栏： CSS技术

本文链接：https://blog.youkuaiyun.com/iteye_7414/article/details/81864665

版权

1 篇文章

订阅专栏

本文探讨了在使用HTML布局时，非浮动元素与浮动元素在同一页面上出现时导致的文本错行问题，并提供了两种解决方案：将浮动元素提前显示或使文本也设为浮动。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<a href="#" title="<%#Eval("title") %>"><%#Eval("title") %></a> 
<span>[<%#Eval("dateline") %>]</span>

...  span {
   ...
   float:right; 
   ...
}

这样<span>...</span>的内容到了<a>...</a>下一行，典型的问题就是新闻列表中题目和日期错行！

这个问题出现在IE8的兼容模式下，IE8和火狐都没有问题。

当非float的元素和float的元素在一起的时候，如果非float元素在先，那么float的元素将被排斥
也就是说，你的span是float:right，但是你文本还是float:none

如果要让两者占据同一行: