は、2つの浮動divを同じ高さに動的

Question

状況を作る：私は2人の直接の子、の入った容器を持っている私たちはがと右を残し、それらを呼び出します。
しかし右がのがを左高さを超えて延長を許可する必要があり、右の高さを過ぎて拡張するために許可すべきではないを残しました。私は（私のマークアップの単純さを維持しながら、うまくいけば）CSSでこれを行う方法を見つけ出すことはできません

例のHTML

<div class="wrapper"> 
    <div class="left"> 
     left 
    </div> 
    <div class="right"> 
     right 
    </div> 
</div> 

例のCSS

.wrapper { 
    display: inline-block; 
    margin: 10px 0; 
} 
.left { 
    float: left; 
    width: 60px; 
    background-color: #999; 
} 
.right { 
    float: left; 
    width: 540px; 
    border: 4px solid #666; 
    padding: 8px; 
} 

or see what I mean here

Answer 1

はい、この種の問題にはJavaScriptを使用する必要があります。ちょうど、常に、右の列の高さに応じて、左の列の最小高さを設定することができます。

jQueryを使用すると、これは始めるのに役立ちます！ http://www.cssnewbie.com/equal-height-columns-with-jquery/

Answer 2

よくある問題です。問題は、あなたはCSS /背景画像のトリックかjavascriptを使う必要があることです。よく使われるものの1つはFaux Columnsです。