Wednesday 26th of July 2017 10:44:01 AM

left

#left {
position: absolute;
left: 2%;
width: 19%;
top: 106px;
background-color: #ffffff;
}

Warning

These pages use certain CSS definitions that are unsupported by older browsers.
more nice and free css templates


css


middleleft

#middleleft {
position: absolute;
left: 22%;
width: 28%;
top: 106px;
background-color: #ffffff;
}

Calculations in your head

This example requires some calculations. The sum of the widths yields 98%. The distance from the border of body to the first box plus its width plu the distance yields the left position of the next box.

If you want boxes of different width you need to adjust these values accordingly.

Use of this code is encouraged!

Try it with 2 or 3 columns



middleright

#middleright {
position: absolute;
left: 51%;
width: 28%;
top: 106px;
background-color: #ffffff;
}

box border

Borders, pading and margin are defined in

#right,#middleright,#middleleft,#left{
border: 1px solid #564b47;
padding:0px;
margin:0px;
}

Font definitions

Padding are passed to p, h1 and h3.

p,h1, h3, pre {
padding: 5px 15px;
margin: 0px;
}


P.one {color: rgb(300%,4200%,110%);}P.two {color: rgb(0%,-40%,-5000%);}
Figure 3-2

Figure 3-2. Out-of-range values are clipped

3.1.2.2. Going by numbers

Closely related to percentages is a color to be applied to all H2 elements that are subsection headings. It would be much better to pick a class name like subsec or even sub-section. Both of these names have the advantage of actually meaning something -- and, furthermore, of being independent of any presentational concepts. After all, you might decide later to make all subsection titles dark red instead of dark blue, and the statement H2.dkblue {color: maroon;} is a little silly.

<LI>Item the fifth</OL>
Figure 7-80

Figure 7-80. Switching off list-item markers

list-style-type is inherited, so if you want tohave different styles of bullet in nested lists, you'll need todefine them individually. You may also have to explicitly declarestyles for nested lists because the user agent's style sheetmay already have defined such styles. Assume that a UA has thefollowing styles defined:

If you want to give your positioned element a specific width, then the obvious property to turn to is width. Similarly, height will let you declare a specific height for a positioned element.

width

WARNING

Percentage values refer to the width of the containing block.