如何解决IE7浮动Bug的解决方法?
| 我有以下HTML:<div><span>left</span><span style=\"float:right;\">right</span></div>
由于某种原因,float:right,向右浮动,但也下降了1行。为什么会发生这种情况,并且有解决方法?
这是一个演示它的jsfiddle:http://jsfiddle.net/CxaW6/
但是,仅当您通过IE7查看链接时,它才会显示错误。
解决方法
剩下另一个跨度浮动将解决此问题。
<div><span style=\"float:left;\">left</span><span style=\"float:right;\">right</span></div>
通常将span
视为内联元素。 IE7似乎以不同的方式处理它们,因此将第一个跨度的宽度(在布局过程中)扩展到100%。在这种情况下,该行中的其他跨度没有足够的空间,因此它将被包裹到下一行。
, 您可以使用float: left
(我的首选解决方案)将浮动范围显式地向左浮动,也可以将右浮动范围的第一个置于标记中。问题与IE7有关,它给第一个跨度提供了虚拟全宽,从而导致第二个跨度在\'next \'行上呈现。
, 将第一个跨度浮动到左侧,或将第一个跨度浮动到右侧,然后从第二个浮动属性中删除。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。