水平コンテンツのdivここ

Question

が私のマークアップである：ここでは

<div id="why-us"> 
    <span class="heading">Why Us?</span> 
    <div class="section"> 
     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> 
     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> 
    </div> 
    <div class="section"> 
     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> 
     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> 
    </div> 
</div> 

は私のCSSです：

#why-us { float: left; } 
#why-us span.heading { font-size: 13pt; color: #3A3A3A; display: block; } 
#why-us div.section { float: left; width: 400px; margin-right: 50px; } 
#why-us div.section p { font-size: 9pt; } 

どのように私はそれが最後のものだけを除く各div.sectionにmargin-right: 50px;を適用することができますか？純粋なCSSでのみこれを行うことができますか？理想的には、 ".last"クラスを指定したり、すべてのブラウザでサイトが動作する必要があるため、疑似クラスを使用したりすることは望ましくありません。

編集：これを行うには、より良い方法はありますか？ PHPを使用してコードを生成しているので、最後のDIVをチェックするために余分なコードを追加する必要があります。私はそれがあまりにも悪くはないと知っているが、それでも私はもっとエレガントなソリューションを好むだろう:)

Answer 1

にとあなたは、最後のdivにCSSをオーバーライドすることができます：

<div id="why-us"> 
    <span class="heading">Why Us?</span> 
    <div class="section"> 
     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> 
     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> 
    </div> 
    <div class="section" style="margin-right: 0px;"> 
     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> 
     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> 
    </div> 
</div> 

それは本当に醜いですが、私はそれを考えますうまくいくはずです。次のように

Answer 2

あなたは子供セレクタを使用することができます

#why-us div.section:last-child{ 
    margin-right:0; 
} 

例：http://jsfiddle.net/Br2DG/