logo标签列表

在IE 7中，将浮动<span>放在右侧，其余（文本）放在左侧的<div>中。

htmlcssinternet-explorer-7css-float
9

我有一些文字和<span>标签，它们在一个<div>中。

<span>使用float:right;样式，我需要文字在左侧而<span>在右侧。

除了ie7浏览器外，它在每个浏览器中都显示得很完美。如何修复这个错误?

<!DOCTYPE HTML>
<html>
    <head>
        <meta charset="utf-8">
        <title> Testing page</title>
    </head>
    <body>
        <div style="border:2px solid #000; display:inline;"> 
            welcome<span style="float:right"> demo</span>
        </div>
    </body>
</html>
3
你的问题实际上与IE7有关，但我猜你可能无法解决它... ;) （注意：本翻译旨在保持原意并尽可能简洁易懂，不包含任何额外信息或解释。） - icedwater
4个回答
9
移动 span 到文本之前，这应该会有所帮助。
谢谢您的回复，它有效了..但现在我不能交换它，因为它正在生产过程中。 上面我向您展示了一个样本数据。是否有其他解决方案来解决我的问题？ - RAN
谢谢，我用这种方式修复了错误。因为我得到的所有其他方法都比你的方法复杂（我认为是这样）。 - RAN
你能解释一下为什么吗？如果你详细说明你的答案，我会点赞的。 - Jori
这真的很简单而且有效。 - AurA
8
使 span 元素变成块级元素并移动。
例如：
span{
  display: block;
  float: right;
}
2

能否将文本放在 <p> 标签中，并将其设置为 display: inline？

谢谢...但我认为跟@simoncereska的方法更好。 我用那个方法修复了这个bug。 - RAN
0
使用以下CSS即可生效：DEMO LINK

*{
    padding:0;
    margin:0;
    }
body {
    font:normal 12px/18px Arial, Helvetica, sans-serif;
    color:#000;
    padding:20px;
    }
.container {
    border:2px solid #000;
    padding:20px;
    overflow:hidden;
    height:100%;
    }
.container span {
    display:inline-block;
    *float:left;
    }
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接