Fluid width with equally spaced DIVs

by

I have a fluid width container DIV.

Within this I have 4 DIVs all 300px x 250px…

<div id="container">
   <div class="box1"> </div>
   <div class="box2"> </div>
   <div class="box3"> </div>
   <div class="box4"> </div>
</div>

What I want to happen is box 1 to be floated left, box 4 to be floated right and box 2 and 3 to be spaced evenly between them. I want the spacing to be fluid as well so as the browser is made smaller the space becomes smaller also.

enter image description here

7 Answers
7

Leave a Comment