[DRAFT]
Procedure for customizing the HEADER AREA starting from the code I given above.
This Procedure is just an attempt to formalize with an algorithm a possible way to customize the header area. There are many possible way to obtain the same result. It could be exist a better procedure ;)
Of course it is not necessary to use all the Properties in all the boxes; it is enough tu use only some of those; in general starting from the minimal code above (without padding and margin and with height and width to auto) you have to search adding the lesser number of assignments (property:value;)as possible to maintain the highest order in the layout.

Preparing to create your own Header
Copy the minimal code you find above and paste it at the bottom of your custom CSS box; use the preview to see the changes you make

Positioning the header
in the selector

div#owner_nav {
margin: ...,...,...,...;
}

margin-top:...px; to move down the header
margin-right:...px; to create a space between the left border of the window's browser and the right border of the header; the border will remain fixed to the defined distance from the right border of the window when you resize the window (or with different screen resolutions)
[it means the width of the header change with the window size of the visitor's browser] margin-bottom:...px; to move down the item boxes and the whole body of the site making a gap between the header and the item boxes
margin-left:...px; to move to the left the header

a typical form to use could be

div#owner_nav {
margin: ...px,auto,...px;
}
where first is margin top, second are the left and right margins and third is margin bottom;
The value auto assigns to left and right an automatic simmetric space, centering the box in its containing box.
another used is

div#owner_nav {
margin: 0pt,auto;
}



backgorund image & background color
(bg color is overlaid by bg image)
Normally u want to put an image in the Header, or you want to fill it with some color

If the image affects both the title and nav areas
then you have to add that in

div#owner_nav {
width:...px;
height:...px;
}

else If the image affects only the title (leaving below the nav bar with another background)
then u have to use the selector h1#page_owner_title

h1#page_owner_title {
width:...px;
height:...px;
}

now the h1#page_owner_title with the contained image is aligned to the left
an elegant way to center it is

h1#page_owner_title {
margin:0pt auto;
}

this gives 0px to top and bottom margins and automatic length to left and right margins so that the two margins will be equals with any screen resolution. It is not recognized by IE lte5.5



Use the padding in h1#page_owner_title to move the site title text into the Header


Positioning the Navigation Bar AKA Menu
After you have positioned the Site Title Text and the bg image for the header you have to posizioning the Nav Bar;
Use the margin top in div#subnavc to move down the nav bar creating space between the title box and it
Use the margin left in div#subnavc to move to the right the nav bar in a fixed way
div#subnavc {
margin-top:...px;
margin-left:...px;
}

if u want to center the Nav Bar in the page then use
div#subnavc {
margin-left:auto;
margin-right:auto;
width:...;
}
or as equivalent form
div#subnavc {
margin:...px auto;
width:...;
}

if u want to move the nav bar to the right, maintaining it anchored to the right border of the window then use
div#subnav {
margin-left:auto;
margin-right:0px;
width:...px;
}
note that normally the nav fills all the width of the containing box (the header) therefore if you do not assign some fixed value in pixel for the width the nav doesn't move itself (in the code the value is auto ).
you can to apply this code to the div#subnav { } selector/box too obtaining the same results.

Remember to maintains the div#owner_nav containing both the h1#page_owner_title and the div#subnavc;

If u want a background and/or a border for the whole navigation bar you have to add that in div#subnavc and in the same box you have to define the exact width and height for that or you could to use a bar in the whole width of the page.
after use can to use the padding in div#subnav leaving width and height to auto and do not use any padding in div#subnavc (its a IE lte 5.5 box model hack).

Now you have to customize the Buttons/Links/TABS.
a.topt and a.toptsel are contained in the div#subnavc box
just define width and height for the buttons and
use the margin-left and/or the margin-right to separate the buttons
use the line-heght:1.3em; to change the vertical position for the links
do not use the padding top for this if u already are defining the height (IE lte 5.5 box model hack)



I need to see some particular example to make the general rule (I hope)

To Be Completed........