方法：固定幅divの2可変幅div？

Question

サブ見出しのスタイルを設定しようとしていますが、見出しの幅が960のグリッドに固定されているデザインがあります。

見出しのタイトルは末尾の装飾で終わる必要があります（この場合、2行は一番下に並んでいます）。そこで、タイトルを保持するdivと、固定幅のコンテナの内側にある装飾を保持するdivを作成します。

見出しdivを展開すると、divのサイズが自動的に変更されるようにするにはどうすればよいですか？ここで

<h1 class="fixed-width"> 

    <span class="auto-width">text expands her...</span> 

    <span class="auto-decor-width">this is the text decoration</span> 

</h1> 

画像の例である：私は理解あたりとして

Answer 1

それはあなたがhttp://jsfiddle.net/sandeep/c2sF6/

span{ 
    display:block 
} 
.fixed-width{ 
    width:960px; 
} 
.auto-width{ 
    float:left; 
    background:green; 
} 

.auto-decor-width{ 
    overflow:hidden; 
    background:red; 
} 

を望んだかもしれ、それはそれより簡単に行う場合ここ

は一例です

Answer 2

それは簡単になります：

h1 { 
    background: red; 
} 

.auto-width { 
    float: left; 
    background: green; 
} 

ライブデモ：知識のためhttp://jsfiddle.net/c2sF6/1/