Div repeat-x surrounded by left and right div

It can be either fixed or liquid height. The left and right columns have a fixed width, and the center column is fluid. In the source, the side columns are auxiliary, and after the central column. Although you can create each column directly, be careful when editing width / padding / margin / border ... you need to make a few changes to the CSS for each of them (but it is grouped and commented well enough so that you don't have too many problems )

CSS:

<style>
.two-col {
 overflow:hidden;
}
.two-col > aside {
 position:relative;
 float:left;
 width:250px;
 padding-bottom:10000px;
 margin-bottom:-10000px;
}
.two-col > div {
 position:relative;
 float:left;
 width:100%;
 padding-bottom:10000px;
 margin-bottom:-10000px;
}
.two-col.right {
 padding-left:0;
 padding-right:270px; /* Width of aside (width+padding+margin+border) */
}
.two-col.right > aside {
 margin-right:-100%;
}
.two-col.right > div {
 margin-right:10px;
 padding-right:10px;
}
.two-col.left {
 padding-left:260px; /* Width of aside (width+padding+margin+border) */
}
.two-col.left > aside {
 right:260px; /* Width of aside (width+padding+margin+border) */
 margin-left:-100%;
}
.two-col.left > div {
 margin-left:-10px; /* Left padding + left border */
 padding-left:10px;
}
.searchbar.two-col .two-col {
 padding-bottom:10000px;
 margin-bottom:-10000px;
}

.searchbar {
 height:75px; /* Simply remove this to have fluid height */
}
.searchbar .leftColumn { /* Left Column */

}
.searchbar .rightColumn { /* Right Column */

}
.searchbar .centerColumn { /* Center Column */

}

</style>

And HTML:

<div class="two-col left searchbar">
 <div>
  <div class="two-col right">
   <div class="centerColumn">Center</div>
   <aside class="rightColumn">Right</aside>
  </div>
 </div>
 <aside class="leftColumn">Left</aside>
</div>