Float and position. is there a way to sort it out?

height of div with id theatre is not varied as per the size of image but when i remove float from img the size of theatre varies why is it so? and how can get the height equal to that of image which remains on the right side of div\[code\]<div id="theatre"> <img src="http://www.wallmay.net/thumbnails/detail/20120927/abstract%20paintings%20outer%20space%20futuristic%20planets%20hope%20digital%20art%20science%20fiction%20space%20art%20blue%20li_www.wallmay.net_34.jpg"/></div>#theatre{width:100%;margin:auto;position:relative;border-top:4px solid #fff;border-bottom:5px solid #fff; }#theatre img{height:400px;float:right;}\[/code\]
 
Back
Top