Using CSS for 3 column layout, left/right variable size, mid fluid

Viewed 1542

I need 3 column layout, first and 3rd column sizes are variable because there will be image or some variable length text(or another image) but i need middle to fill the rest space with background image, something like this if it would work like i imagine :

HTML:

<div class="left-vp">
   <img src="~/Content/images/vp1.png" />
</div>
<div class="mid-vp">

</div>
<div class="right-vp">
<p>
    //some text here or another img
</p>
</div>

CSS

 .left-vp {
    float: left;
 }

 .mid-vp {
    height: 2px;
    background: #FFFFFF url("images/dot.png") repeat-x;
    width: 100%;
 }
 .right-vp {
    float: right;
 }

Is something like this possible with CSS?

4 Answers
Related