如何阻止元素包装文本内容?

时间:2012-04-21 04:02:30

标签: html css text block textwrapping

我有两个div我希望垂直放置,与左边对齐,我希望它们的宽度根据文本的数量进行换行。

fiddle

.main {
  position: absolute;
  color: white;
}

.line {
  padding: 3px;
  margin: 2px;
  background-color: #505050;
}
<div class="main">
  <div class="line">Content content content content</div>
  <div class="line">Content content</div>
</div>

我之所以要问是否有更直接的解决方案是因为我认为width: 0white-space: nowrap可能会影响不同的内容。

1 个答案:

答案 0 :(得分:2)

据我所知,可能是你想要的。

.main {
    color: white;
}
.line {
    padding: 3px;
    margin: 2px;
    background-color: #505050;
    float:left;
    clear:left;
}

选中此http://jsfiddle.net/2kmzK/1/