CONTENT

All templates are XHTML 1.0 and CSS2/ tableless.

MENU floating
layout grid with a floating menu on the left.
The menu is fixed in it's width. The height adjusts to the content.
more nice and free css templates 

html {
padding:0px;
margin:0px;
}
body {
background-color: #e1ddd9;
font-size: 12px;
font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
color:#564b47;
padding:0px 20px;
margin:0px;
}
#content {
border:1px solid #564b47;
background-color:#fff;
}


where n=3 references the client browser's default font size, typically 12-point, so that the allowable  n values 1 through 7 typically reference 8, 10, 12, 14, 18, 24 and 36 points respectively; "name" references a font name (Arial, Times New Roman or whatever); and "color" is an RGB hexadecimal triple or one of the 16 named colors. 

Then you can change font attributes for special pieces of text in-line with FONT tags: 
<FONT SIZE="n" FACE="name" COLOR="color"> ... </FONT>

Eventually, though, one comes to realize that setting a single colorfor all of the text in a page just isn't enough. That'show

Now, thanks to the power of CSS, you can have many, many differentcolors within a single page, and without using a singleFONT tag. This gives authors the ability to set uppages where the main text is black with a white background, but thenavigational hyperlinks along the side of the page are black on alight purple background. There are almost infinite possibilities:defining red text for warnings, using a dark purple to make boldfaced 

DIV#sidebar {position: absolute; top: 0; left: 0; width: 5em; height: 7em;
overflow: hidden; overflow-clip: rect(0, 6em, 9em, 0);}
Figure 9-13

Figure 9-13. Expanding the clipping region

This extends the area in which content can be seen. However, it doesn't change the flow of the content, so the only visual effect is that more content can be seen below the element. The text does not flow out to the right, because the width of its line boxes is still constrained by the width of the positioned element. If there had been an image wider than the positioned element, or preformatted text with a long line, this might have been visible to the right of

As we can see in Figure 6-34, the very small image triplebor.gif is repeated vertically along the left side of the heading element, resulting in an effect that isn't otherwise possible.

Figure 6-34

Figure 6-34. Creating a "triple border" on H2 elements

We can take that further and decide to set a wavy border along the top of each H1 element, as illustrated in Figure 6-35. The image is colored in such a way that it blends with the background color and produces the wavy effect shown: