Sometimes on a web page you have a div container with 2 or more divs within. In many cases, you’ll want the background from one of the divs to fill the container div. Unfortunately, the div style property height does not support a percentage value as of XHTML 1.1. Instead, you can “fool” the div by repeating the background on the container control like this:

1
2
3
4
5
6
7
8
9
10
11

<div id="container" style="background-image: url('containerbkg.gif'); background-repeat: repeat-y;">  
    <div id="menu" style="float: left; width: 100px;">  
        Item 1<br/>  
        Item 2  
    </div>  
    <div id="body" style="margin-left: 100px; width: 300pt;">  
        Body goes here<br/><br/>  
        Body continues here<br/><br/>  
        Body ends here.  
    </div>  
</div>