line, there is an image 50 pixels tall, you get the result shown inFigure 4-42:

SUP {vertical-align: 50%;}
Figure 4-42

Figure 4-42. Vertical alignment with a percentage and a tall image

The 50%-aligned element has its baseline raised 7pixels (which is half of 14px), not25 pixels. Also note that the line-box has been made tallenough to accommodate the image. This is actually consistent with theinline box model, because replaced elements have this kind of effect.

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;

1. The left (or right) outer edge of a floated element may not be to the left (or right) of the inner edge of its parent element.

Straightforward enough. The furthest to the left the outer left edge of a left-floated element may go is the inner left edge of its parent element; similarly, the furthest right a right-floated element may go is its parent's inner right edge, as shown in Figure 8-30. (In this and subsequent figures, the circled numbers show the position where the markup element actually appears