html - 見出しの背景を見出しと同じ長さにするにはどうすればよいですか?

Question

見出しの背景を見出しと同じ幅にしようとしており、見出しに合わせて背景画像のサイズを自動的に変更したいと考えています。助けてフィドルを見てください：こちら

マークアップ:

<div class="custom-section-head">

<h3>news</h3>

</div>

CSS:

.custom-section-head {
background: red;
}

Answer 1

フロートを使用する:

フィドルを参照してください: http://jsfiddle.net/Zb6KV/4/

.custom-section-head {
    background: red;
    float:left;
}

h3 {
    float:left;
  }

次に、h3 とコンテナーが見出しのサイズになります。しかし、head<h3>要素に背景を追加しないのはなぜでしょうか?

Answer 2

のクラスを設定する代わりに、そのためdivに を追加できspanます。

<h3><span class="custom-section-head">news</span></h3>

これが更新されたフィドルです