Friday 23rd of June 2017 05:24:31 AM

MENU left

Menu with fixed width.

#left {
width:175px;
padding:0px;
float:left;
}

CONTENT

All templates are XHTML 1.0 and CSS2/ tableless.
3 columns layout grid. All colums are fixed and centered.
more nice and free css templates

html {
padding:0px;
margin:0px;
}
body {
background-color: #e1ddd9;
font-size: 12px;
color:#564b47;
text-align:center;
margin:0px;
padding:0px;
}
#box {
width:750px;
margin: 0px auto;
padding:0px;
text-align:left;
}
#content {
width:400px;
padding:0px;
float:left;
background-color:#fff;
overflow: auto;
}
#head {
background-color:transparent;
}

Another important thing about the containing block is this: elementscan be positioned outside of their containing block. This is verysimilar to the way in which floated elements can use negative marginsto float outside of their parent's content area. It also makesit seem like the term "containing block" should really be"positioning context," but since the specification uses"containing block," so will this text. (We do try tominimize confusion. Really!)

The values of position have the following meanings:


lead to a situation similar to that shown in Figure 9-20:

BODY {position: relative;}
<P STYLE="position: absolute; top: 0; right: 25%; left: 25%; bottom: auto;
width: 50%; height: auto; background: silver;">...</P>
Figure 9-20

Figure 9-20. An absolutely positioned paragraph

The paragraph is now positioned at the very beginning of the document, half as wide as the document's width and overwriting the first few elements!