Tuesday 16th of January 2018 12:37:42 PM


#left {
position: absolute;
left: 0px;
width: 190px;
color: #564b47;
margin: 0px;
padding: 0px;

This column inherited it'b background color from the body definition. The padding ist defined through the p element.


3 columns / menu fixed, content dynamic with head and footer.
3 column layout grid. The navigation column are fixed in width, the content column is dynamic and adjusts itself 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;
#content {
elements in a document to be one-and-one-half times theirfont-size. You would declare:

BODY {line-height: 1.5;}

This scaling factor of 1.5 is passed down fromelement to element, and at each level the factor is used as amultiplier of the font-size of each element.Therefore, the following markup would be displayed as shown in Figure 8-64 (backgrounds added for illustrative purposes):

P {font-size: 12px; line-height: 1.5;}
margin: 0px 190px 0px 190px;
border-left: 2px solid #564b47;
border-right: 2px solid #564b47;
padding: 0px;
background-color: #ffffff;

in valid code we trust (*^_^*) miss monorom

around absolute positioning. Since absolute positioning is the simplest scheme in which to demonstrate how top, right, bottom, and left work, we'll stick to that for now.

Figure 9-2

Figure 9-2. Positioning an element within its containing block

Note that the positioned element has padding, a double border, and a slightly different background color. In Figure 9-2, it has no margins, but if it did, they would create blank space are differences in the handling of element placement along thehorizontal and vertical axes, for example. In order to fullyunderstand how block-level elements are handled, you must clearlyunderstand a number of boundaries and areas. They are shown in detailin Figure 8-2.

Figure 8-2

Figure 8-2. The complete box model

In general, the width of an element is defined tobe the distance from the left inner edge to the right inner edge, andthe height is the distance from the inner top to

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 bemaroon and BODY elements to have a yellowbackground.

BLOCKQUOTE {font-style: italic;}
BLOCKQUOTE EM, BLOCKQUOTE I {font-style: normal;}
Figure 5-28

Figure 5-28. Common typographical conventions through CSS

5.4.2. Font Variations