Divisions described earlier in the HTML document 'stack' behind divisions described later in the document.
a relative division:

div.two
{
position:relative; left:75%;
width:320px;
margin-left:-160px;
vertical-position:relative;
top:30px;
height:240px;
color:#ffffff;
background-color:#69673d;
opacity:0.5;
border-radius:10px;
border:2px solid #3f6742;
}
Defined in body of page:

<div style="position:absolute; left:20px; width:640px; vertical-position:absolute; top:20px; height:520px; border-radius:10px; border:2px solid #3f6742;">division</div>

Divisions described later in the HTML document appear in front of earlier described divisions.

D I V I S O N
a fixed division; 160x80, left 95px, top 200px
absolute division (div.one); 640x480, left: 50%; w/-320px left margin, top 25%

This division is styled in the head section of the page and placed in the
document body using <div class="one"> statement.

position:abosoulte; left:50%; WITH margin-left;-320px; (half of 640px width)
centers the division on the page.
<style>
div.one
{
position:absolute; left:50%;
width:640px;
margin-left:-320px;
vertical-position:absolute;
top:25%;
height:480px;
color:#ffffff;
background-color:#3f4267;
opacity:0.5;
border-radius:10px;
border:2px solid #3f6742;
}
</style>
same relative division (div.two) used above;
styled "top:350px"

<div class="two" style="top:360px">

to translate the division lower on the page
relative 'codepage' division translated left 250px, margin-top 240px w/
background-image:url('DDgradienti.png'); background-repeat: repeat-x;

code5 | divisions | more divisions

div in div 160x160;
left 35px; top 100px;
padding 2px;
border-radius 10px; 2px solid

twin div in div
(not a clone)
left 215px - padding 6px

left 405px;
padding 6px; border-radius 100px
2px dotted

Divisions

position:absolute; - - - - - - - static (default), relative, absolute, fixed
width:320px; - - - - - - - - - - fixed pixels or percentage of page
vertical-position:absolute
top: 20px;
height:240px
margin:10px;

Margin - Individual sides:

margin-top:20px;
margin-bottom:20px;
margin-right:20px
margin-left:20px;

Margin - Shorthand property (100px from top 50px from left):

margin:100px 50px;

The margin property can have from one to four values:

margin:25px 50px 75px 100px; (top, right, bottom, left)
margin:25px 50px 75px; (top, right and left - 50px - and bottom)
margin:25px 50px; (top and bottom, left and right)
margin:25px; (all four margins are 25px)

padding:10px;
color:#3f4267;
background-color:#ffffff; (white)
opacity:0.5;

border:5px solid gray; top, right, bottom, left; dashed, dotted, solid, double



Translated class="one" division - left:36%; top:1120px; - with padding attibute added, and background color, opacity, border-radius, size and decoration (default solid -> dashed) were all modified within the div class=statement:

<div class="one" style="left:36%; top:1120px; padding:6px; background-color:#406666; opacity:0.6; border-radius:10px; border:4px dashed #03056f;"><p style="color:#ffffff;">

The <p style="color:#ffffff;"> paragraph statement over-rides the default font color definition in 'rqstyle5.css' and formats the paragraph text to white.

more divisions
code5 | divisions | more divisions