Question

我在使用某些css时遇到了一些麻烦，我希望将文字换行以便标签位于中间右侧，如http://i.imgur.com/ss9lKk2.png，但目前它看起来像http://jsfiddle.net/yuvemL1z/标签被推到文本下面，如果有人可以提供帮助那就太棒了，谢谢。

<div class="container">
    <div class="row">
        <div class="col-md-4">Text Test Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text<span class="label label-default pull-right">New</span></div>
        <div class="col-md-4">Text</div>
        <div class="col-md-4">Text</div>
    </div>
</div>

h4 {
    margin-top: 25px;
}
.row {
    margin-bottom: 20px;
}
.row .row {
    margin-top: 10px;
    margin-bottom: 0;
}
[class*="col-"] {
    padding-top: 15px;
    padding-bottom: 15px;
    background-color: #eee;
    background-color: rgba(86,61,124,.15);
    border: 1px solid #ddd;
    border: 1px solid rgba(86,61,124,.2);
}
hr {
    margin-top: 40px;
    margin-bottom: 40px;
}

Answer 1

添加一个元素以包含文本，如下所示：

<div class="col-md-4"><div class="innertext">Text Test Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text</div><span class="label label-default pull-right">New</span></div>

现在，只需设置.innertext div的样式，如下所示：

.innertext{display:inline-block; width:90%}

See fiddle

文本在标签（bootstrap）之前不会换行

1 个答案: