Question

我希望有一个跨度，在那个范围内，我希望有两种不同大小的文本。但我希望他们彼此相邻。

我已经尝试过将两个跨度放在一起，我已经尝试将它们放入div中，我已经尝试将它们放在单独的div中，我试过浮动它们......

无法使其发挥作用：（

我知道这可能很简单，任何善良的灵魂都可以帮助吗？

这是div中消失的一部分，下面是代码：

<div id='message' style="display: none;">
    <span class="big">Wow, that was quick! </span><span>- below is a preview of your page, fill the form below and click publish.</span>
    <a href="#" class="close-notify">X</a>
</div>

的CSS：

#message {height:30px;width:100%;z-index:105;text-align:center;color:white;padding:10px 0px 10px 0px;background-color:#8E1609;display:inline;}
#message span {text-align: center;width: 95%;float:left;}
.close-notify {white-space: nowrap;float:right;margin-right:10px;color:#fff;text-decoration:none;border:2px #fff solid;padding-left:3px;padding-right:3px}
.close-notify a {color: #fff;}
.big{font-size:1.3em;}

的javascript：

$(document).ready(function() {
    $("#message").fadeIn("slow");
    $("#message a.close-notify").click(function() {
        $("#message").fadeOut("slow");
        return false;
    });
});

Answer 1

发生这种情况是因为您的第一个span有width: 95%。只需删除它，一切都会正常工作

http://jsfiddle.net/qcnZA/

Answer 2

两个跨度对我很有用。可能还有另一个原因让你无法正常工作。

<div>
    <span style="font-size:10px">Small</span>
    <span style="font-size:20px">Big</span>
</div>

http://jsfiddle.net/TUCr6/1/

Answer 3

你能发布你的代码吗？

<span class="bold">Bold</span><span class="red"> and red</span>

父元素是内联的，

应显示在1行上。

简单的html / css Qu - 如何在同一行上获得两种字体大小？

3 个答案: