I have two div box Left and right... I need flexible listing height in right div box as left box content are not fixed...Means if i add some contents in 'left div box'.. then 'right div box' autoflow content box height should be adjust accordingly
Here is a link/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">[email protected]</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">[email protected]</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">[email protected]</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">[email protected]</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">[email protected]</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">[email protected]</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">[email protected]</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">[email protected]</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">[email protected]</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">[email protected]</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">[email protected]</span> </div><!--sharecon--> </div><!--contactlist--></div><!--Right Block Ends Here---></div>
Here is a link/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">[email protected]</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">[email protected]</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">[email protected]</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">[email protected]</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">[email protected]</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">[email protected]</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">[email protected]</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">[email protected]</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">[email protected]</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">[email protected]</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">[email protected]</span> </div><!--sharecon--> </div><!--contactlist--></div><!--Right Block Ends Here---></div>