So I'm trying a new look for a site. The layout has rounded corners and there are drop shadows. As you may suspect there are a number of pictures involved that need to be placed in the right spots to achive this affect. I can make the box with a fixed height for the line on the right hand side but when I add some content in the middle area things get all funky and the line on the right hand side disappears. If I leave the content out everything looks fine, although the fixed height has to be in place, which is not what I'm going for. I've tried doing height:100% and I've tried adding repeat-y 100% but no luck.
I added two pictures to give you an idea of what I'm talking about.
My goal is to have the right line span to the bottom picture and get bigger as content fills in the middle area.
<img alt="" src="/img/body/Form/form-top.gif" style="padding-left:15px;" />
<div style="width:903px; padding-left:15px;">
<div style="width:7px; float:right; background: transparent url('/img/body/Form/form-right.gif') repeat-y 100%;"></div>
<a href=""><img alt="Request a Quote" src="/img/body/Form/request-a-quote-button.gif" /></a>
<img alt="" src="/img/body/Form/form-bottom.gif" />