IE兼容性问题:<span>内部<h2>

Question

我有以下HTML/CSS,它只是在<span>标签float:right内部标记了样式<h2>:

<style>h2{background-color:#e2e2e2;}
span{float:right;border:1px solid red;}</style>
<h2>H2 Test <span>SPAN text</span></h2>

一切都适用于Firefox(我怀疑其他好的浏览器,如Chrome,Opera等),但在IE中,<span>被迫进入下一行.

注意:该图显示了Firefox和IE的示例. 在此输入图像描述

如何让IE重复Firefox的行为？

附加信息:我没有被锁定使用float:right,我真正想要的是左对齐的文本的一部分,并且文本的一部分右对齐<h2>.我尝试了很多东西,但IE似乎总是不会起作用的浏览器.任何帮助,将不胜感激.

Answer 1

HTML:

<h2><span class="_1">H2 Test</span><span class="_2">SPAN text</span></h2>

CSS:

h2{background-color:#e2e2e2;overflow:hidden}
span._1{float:left}
span._2{float:right;border:1px solid red;}