标签换行 - 应该跨越整个div

Question

我有一个名为bar的CSS类。示例中的My Label（Span）是“非常不满意”。如果宽度百分比较低（即：5％），则标签行会中断（例如：非常[换行]不满意），而不是跨越bar18.png图形跨越整个div。

CSS：

.bar {
background: transparent url(bar18.png) repeat-x top left;
float: left;
clear: left;
height: 30px;
}

.bar span{
font-size: 12px;
font-weight: bold;
color: #000;
float: left;
margin-left: 5px;
margin-top: 7px;
}

HTML：

<div class="bar" style="width:8%;">
    <span>Very Dissatisfied</span>
</div>
<div class="p">
    <span>(1) 8%</span>
</div>

Answer 1

请试试这个：

span{margin-left:20%}
.bar {
background: transparent url(bar18.png) repeat-x top left;
float: left;
clear: left;
height: 30px;
}

.bar span{
font-size: 12px;
font-weight: bold;
color: #000;
float: left;
margin-left: 5px;
margin-top: 7px;
white-space: nowrap;
}