Content / Border -Trick

All templates are XHTML 1.0 and CSS2/ tableless.
This Template has been tested on the following Browser:
MAC Safari, Opera6.3 Opera8.5, Mozilla, Firefox, IE
PC: IE 6, Firefox
Linux: Konqueror, Firefox

Dowload Template

3 columns / centered / fixed width
3 columns grid, both sides have a fixed width and are centered.
The concept with the border-trick is borrowed from an older layout by CssCreator - Generator.

#container {
width: 950px;
padding:0px;
margin: 0px;
margin-left: auto;
margin-right: auto;}

The container-div centers the layout and defines the overall width.

#outer {
border-left: solid 200px #EBD3E0; /* color of the left column  */
border-right: solid 200px #EBD3E0; /* color of the right column  */
background-color: #ffffff; }  /* color of the content column */

The outer-div’s left and right border has the width of the left and right navigation.

#inner {margin:0 px; width:100%; } /* The ie/pc pecularity */

#content { position: relative;  margin: 0px; }

The inner-div is needed because of a pecularity of explorer on pc. It is not required for all other browsers. The inner-div contains the left-, and content-div. The left-div’s left position is negative to the value of the border width of content-div. Hence, the left-div shifts succinctly over the content-divs wide border.

Get More Templates :

Border Trick TEMPLATES

• 
  2 columns fixed
  centered
• 
  3 columns fixed
  centered