html - 使 CSS div 高度等于内容而不改变宽度

Question

我希望 Div 元素的高度仅扩展到我的表格元素的宽度，但保持它的宽度与屏幕大小一样长。使用 'display: inline-block' 将包装宽度和高度。例如下面的代码也适合宽度。

<div style="display: inline-block; float: right; background-color: green;">
  <div style="float: right;">first item</div>
  <div style="float: left;">second item</div>
</div>

有什么建议么？

谢谢！

Answer 1

你可以试试；

.container div{
    width:50%;
    background: green
}

和

<div class="container" style="background: green;width:100%">
  <div style="float: right">first item</div>
  <div style="float: left">second item</div>
</div>

这是一个现场演示。您也可以尝试为左右 div 添加单独的类，或者可以使用 CSS3:nth-child()选择器