content column

All templates are XHTML 1.0 and CSS2/ tableless.

2 columns / menu and content dynamic
2 column layout grid. The navigation column and content column are dynamic and adjust themselves to the browser window.
This layout also works with an absolute height
TEMPLATE 100% height
more nice and free css templates

html {
body {
background-color: #e1ddd9;
font-size: 12px;
font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
padding:0px 20px;
#content {
float: left;
width: 75%;
background-color: #fff;
margin:0px 0px 50px 0px;
overflow: auto;
line boxes that are flowed within their parent element.


The element's box is offset by some distance. Its containingblock is the area that the element would occupy if it were notpositioned. The element retains the shape it would have had were itnot positioned, and the space that the element would ordinarily haveoccupied is preserved. Relative positioning is accomplished by Collapsing vertical margins

There is one other important aspect of vertical formatting, which is the collapsing of adjacent margins. This comes into play when an element with declared margins immediately follows another such element in the document's layout. This was discussed in the previous chapter, using this example: least as heavy as the number that precedes it. Thus,100, 200,300, and 400 might all map tothe same relatively lightweight variant, while 500and 600 could correspond to the same heavier fontvariant, and 700, 800, and900 could all produce the same very heavy fontvariant. As long as no keyword corresponds to a variant that islighter than the variant assigned to the previous keyword, theneverything will be all right.

1.4.4. Actual Styles

H1 {color: maroon;}BODY {background: yellow;}

After the @import statement in our example, wefind some ordinarystyles. What theymean doesn't actually matter for this discussion, although youcan probably guess that they set H1 elements to bemore thing to discuss. You won't always want your content to flow past a floated element -- in some cases, you'll specifically want to prevent it.

If you have a document that is grouped into sections, you might not want the floated elements from one section hanging down into the next. In that case, you'd want to set the first element of each section to prohibit floating elements from appearing next to it. If it might otherwise be placed next to a floated element, it will be pushed down until it appears below the floated image, and all