Making Auto Height Divs, Maintaining Same Width

Question

Hey on my website I have multiple pages with different heights and I am interested in making two banners, one left and right.
The Working Code I used is below:
<div id="left" style="background: url(img/Left.jpg);height: 1500px;width: 150px;float: left;">
</div>
<div id="right" style="background: url(img/Right.jpg);height: 1500px;width: 150px;float: right;">
</div>
This works correctly but with one problem I have to specify the exact height every single time. If I use auto height this only goes for approx. 100px.
I would like the banners to go non-stop until they reach the footer.
Thanks for the help.

Answer 1

Still not working here is what I did.
Pasted the following code in my .css document
#left {
clear:both;
background: url(img/Left.jpeg);
min-height: 610px;
width: 150px;
float: left;
#right {
clear:both;
background: url(img/Right.jpeg);
min-height: 610px;
width: 150px;
float: right;
Pasted the following code in my html document under 'boxcontent'
<div id="left"></div>
<div id="right"></div>
Placed the following .css code in my section called boxcontent
clear:both;
Nothing happens at all.