jquery - オーバーフロー div コンテンツには柔軟な高さが必要

Question

左と右に2つのdivボックスがあります...左ボックスのコンテンツが固定されていないため、右のdivボックスに柔軟なリストの高さが必要です...「左のdivボックス」にコンテンツを追加する場合を意味します..次に「右のdivボックス」オートフローコンテンツボックスの高さはそれに応じて調整する必要があります

ここにリンクがあります

/ CSS /

.dvleft{float:left;} .dvright{float:right}.dv100per{width:100%;float:left}
.grey_bg2{padding: 5px 0px 8px 7px;background-color:#F7F7F7;color:#000; font-size:13px}
.mTop5{margin-top:5px;}.mTop10{margin-top:10px}.mTop20{margin-top:20px}.mleft15{margin-left:15px;}
    .contactlist{background-color:#FFF;float:left;width:100%;padding: 5px 0px 10px 0px;height:239px;overflow:auto}
    .sharecon{float:left;width:100%; border-bottom:solid 1px #e6e6e6; padding:3px 0 6px 0}

/ HTML /

<div class="dvright grey_bg2 mTop20" style="width: 365px; padding: 7px 8px 10px 8px;">
    <div class="dv100per">
        <span class="dvleft">
            <strong>Right Box</strong>
        </span>
    </div>

        <div class="contactlist">
            <div class="sharecon">
                <span class="dvleft">
                    <input type="checkbox" name="checkbox">
                </span>

                <span class="dvleft mleft15">
                    <strong class="text11">abc123..</strong>
                </span>
                <span class="dvleft mleft15">abc123@gmail.com</span>

            </div><!--sharecon-->
            <div class="sharecon">
                <span class="dvleft">
                    <input type="checkbox" name="checkbox">
                </span>

                <span class="dvleft mleft15">
                    <strong class="text11">abc123..</strong>
                </span>
                <span class="dvleft mleft15">abc123@gmail.com</span>

            </div><!--sharecon-->
            <div class="sharecon">
                <span class="dvleft">
                    <input type="checkbox" name="checkbox">
                </span>

                <span class="dvleft mleft15">
                    <strong class="text11">abc123..</strong>
                </span>
                <span class="dvleft mleft15">abc123@gmail.com</span>

            </div><!--sharecon-->
            <div class="sharecon">
                <span class="dvleft">
                    <input type="checkbox" name="checkbox">
                </span>

                <span class="dvleft mleft15">
                    <strong class="text11">abc123..</strong>
                </span>
                <span class="dvleft mleft15">abc123@gmail.com</span>

            </div><!--sharecon-->
            <div class="sharecon">
                <span class="dvleft">
                    <input type="checkbox" name="checkbox">
                </span>

                <span class="dvleft mleft15">
                    <strong class="text11">abc123..</strong>
                </span>
                <span class="dvleft mleft15">abc123@gmail.com</span>

            </div><!--sharecon-->
            <div class="sharecon">
                <span class="dvleft">
                    <input type="checkbox" name="checkbox">
                </span>

                <span class="dvleft mleft15">
                    <strong class="text11">abc123..</strong>
                </span>
                <span class="dvleft mleft15">abc123@gmail.com</span>

            </div><!--sharecon-->
            <div class="sharecon">
                <span class="dvleft">
                    <input type="checkbox" name="checkbox">
                </span>

                <span class="dvleft mleft15">
                    <strong class="text11">abc123..</strong>
                </span>
                <span class="dvleft mleft15">abc123@gmail.com</span>

            </div><!--sharecon-->
            <div class="sharecon">
                <span class="dvleft">
                    <input type="checkbox" name="checkbox">
                </span>

                <span class="dvleft mleft15">
                    <strong class="text11">abc123..</strong>
                </span>
                <span class="dvleft mleft15">abc123@gmail.com</span>

            </div><!--sharecon-->
            <div class="sharecon">
                <span class="dvleft">
                    <input type="checkbox" name="checkbox">
                </span>

                <span class="dvleft mleft15">
                    <strong class="text11">abc123..</strong>
                </span>
                <span class="dvleft mleft15">abc123@gmail.com</span>

            </div><!--sharecon-->
            <div class="sharecon">
                <span class="dvleft">
                    <input type="checkbox" name="checkbox">
                </span>

                <span class="dvleft mleft15">
                    <strong class="text11">abc123..</strong>
                </span>
                <span class="dvleft mleft15">abc123@gmail.com</span>

            </div><!--sharecon-->
            <div class="sharecon">
                <span class="dvleft">
                    <input type="checkbox" name="checkbox">
                </span>

                <span class="dvleft mleft15">
                    <strong class="text11">abc123..</strong>
                </span>
                <span class="dvleft mleft15">abc123@gmail.com</span>

            </div><!--sharecon-->
        </div><!--contactlist-->

</div><!--Right Block Ends Here--->

</div>

Answer 1

jquery equalizeColsプラグインを使用できます

Answer 2

jクエリを使用している場合は、これを試してください。

$(function(){
    var leftDivHeight = $('.dvleft').height();
    var rightDivHeight = $('.dvright').css({height: leftDivHeight});
});