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()セレクター