块元素包装在文本内容上
我有2个div，我想垂直放置，左对齐，我希望他们的宽度基于文本的数量进行换行。
小提琴
<div class="main">
<div class="line">Content content content content</div>
<div class="line">Content content</div>
</div>
.main {
position: absolute;
color: white;
}
.line {
padding: 3px;
margin: 2px;
background-color: #505050;
}
我想出了一个可能的解决方案，但我想知道是否有比这更简单的解决方案。
我提出的解决方案是制作“.line”“display：inline-block”，“white-space：nowrap”并使“.main”“width：0”。
解决方案小提琴
.main {
position: absolute;
color: white;
width: 0;
}
.line {
padding: 3px;
margin: 2px;
background-color: #505050;
display: inline-block;
white-space: nowrap;
/* IE7 fix */
zoom: 1;
*display: inline;
}
有没有更好的选择？
我询问是否有更直接的解决方案是因为我认为“width：0”和“white-space：nowrap”可能会影响不同的内容。
据我了解可能是你想要的。
.main {
color: white;
}
.line {
padding: 3px;
margin: 2px;
background-color: #505050;
float:left;
clear:left;
}
检查这个http://jsfiddle.net/2kmzK/1/
链接地址: http://www.djcxy.com/p/81357.html