Unterseite erstellen?!?!?

Moin Moin,
irgendwie hab ich einen Hänger.(baue zum ersten mal eine page)
Ich habe in einer index.html datei eine recht passable Seite für meine verhältnisse erstellt. Im prinzip habe ich alles über eine styles.css datei erstellt, die ich dann durch <div id="" mit meiner index.html datei verbunden habe. ein paar grafiken etc...
soweit so gut.
jetzt wollte ich mich mal an die unterseiten machen und gerne links einfügen, mit einer rollover funktion.
was ich jetzt irgendwie nicht in meine birne bekomme ist, wie ich eine neue seite erstelle, die vom grundgerüst natürlich wie die index.html page ist, jedoch mit anderem inhalt und vielleicht mit anderen bildern ausgestatted wird.
weil wenn ich die index.html datei kopiere und dann umbenenne z.b. in kontakt.html, müsste ich ja auch eine verlinkung mit der css datei herstellen, da sonst jegliche optische parameter fehlen.
also meine frage: wie kann ich unterseiten mit dem grundgerüst für meine page erstelle?
bitte antwortet so, dass ich es verstehen kann
gruß

dann hab ich gleich noch eine frage;wie unverschämt ;-)...
ich habe mehrere kontainer erstellt in der css. jetzt würde ich die seite gerne zentrieren.
leider funktioniert das nicht so richtig mit
margin:auto;
oder
margin: 0 auto;

die page, die angezeigt werden soll lautet
#page{
width:800px;
height:440px;
position:absolute;
}

liegt das am absolute? ich hab das benutzt, weil ich innerhalb des kontainers #page ja mehere intere kontainer verwenden will,
die ich dann auf relativ gesetzt habe.
bsp:

#hadder{
width:800px;
height:80px;
float:left;
position:relative;
background-image:url(images/headder.png);
}

hier hab ich noch nen float:left, damit nacher alles in der richtigen posi steht.

muss ich irgend was anders machen uum die page zu zentrieren ?

das klingt doch gut, hast du skype oder ähnliches ?
kann des css gern posten.
problem ist, der code fuktioniert bei kopierten seiten, allerdings verändert sich dann ja bei einer unterseite auch alles, wenn ich die css änder.
also im prinzip versteh ich nicht, wie ich von der original index.html unterseiten erstellen kann.
einfach neue datei oder wie läuft das? dann müsst ich ja wieder alles neu formatieren.
ahh skype wäre cool

danke, mit margin etc. hab ich auch bei selfhtml rauslesen können, hat auch geklappt glaub ich...
jetzt ist nur noch das problem mit den unterseiten.
ich kann ja den text mal einfügen.

teilweise schon schan drin, die ich nicht benutze bis jetzt wie .txt ...

ich werds doch nochmal anders versuchen.
hab mich schon weiter eingelesen, glaube die probleme lösen sich echt mit der zeig bei verstehen...

okay, bin jetzt ganzes stück weiter.
jetzt steh ich vor dem letzten problem, dann hätt ich meine page soweit fertig glaub ich.
und zwar hab ich jetzt einen head mit "selbstgebauten" buttons innerhalb meines pagecontainers.
soweit so gut.
jetzt möchte ich weiter in den pagecontainer unter dem hadder zwei boxen erstellen, die gleich groß sind und nebeneinander genau unter dem head anschließen.
irgendwie versteh ich jetzt mein problem nicht. ich wollte es mit float versuchen, geht nicht.
hier mal der css inhalt vom maincontainer, head innerhalb des containers und dann der 2 boxen, die ich nicht hinbekomme.

#container {
width:800px;
height:450px;
margin: auto;
background: white;
}

#head {
height: 80px;
width:800px;
text-align: right;
overflow: hidden;
margin: 0;
background-repeat: no-repeat;
background-image: url(img/hadder.png);
}

#mainleft {
background-image: url(img/contentleft.png);
background-repeat: no-repeat;
width:400px;
height:310px;
float:left;
}

#mainright {
background-image: url(img/contentright.jpg);
background-repeat: no-repeat;
width:400px;
height:310px;
float:right;
}

muss ich doch mit position arbeiten? wurde mir ja irgendwie mal ausgeredet...aber mit margin oder so komm ich auch nicht weiter.
entweder sind die boxen übereinander, schief, was auch immer...

also grafisch solls so sein, oben head unten 2 boxen.
__________
| headder |
-----------
|box|box|

hoff ich bin verständlich

edit: bin vielleicht ein stück weiter, hab den headder auf float:left;
und den mainleft:float left;
die beinden stehen dan nschonmal richtig, nur der containerright nicht, auch mit float:left

ich les es mir mal durch,
ich meinte meinen hadder.
also ich poste mal den html text.

<body>
<div id="container">
<div id="head">
<ul id="menu"></ul>
</div>
<div id="mainleft">
<div id="mainright">
<div id="footer">
</div>
</div>
</div>
</div>

so, du siehst, ich will in meinen container einen (hadder -> darein navigation), 2 hauptbereiche links und rechts und eine fußzeile.
mein problem ist jetzt, dass ich in meinen container den hadder rein hab, dann die mainboxen kommen und dann die fußzeile und die boxen nicht richtig angeordnet sind. es ist keine richtiges layout. die anordnung ist falsch. ich versteh nicht, wie ich innerhalb des containers meine bereiche anordnen kann.

der css text.

#container {
width:800px;
height:450px;
margin: auto;
background: white;
}

#head {
height:80px;
width:800px;
text-align:right;
padding:0;
overflow:hidden;
margin:0;
background-repeat: no-repeat;
background-image: url(img/hadder.png);
float:left;
}

#mainleft {
background-image: url(img/contentleft.png);
background-repeat: no-repeat;
width:400px;
height:310px;
float:left;
}

#mainright {
background-image: url(img/contentright.jpg);
background-repeat: no-repeat;
width:400px;
height:310px;
}

#footer {
float:left;
background-color: #FFF;
background-image: url(img/footer.png);
background-repeat: repeat;
width:800px;
height:50px;
}

vielleicht hilft mir dein schnipsel
muss mal schauen...

edit:
oh krass, bei mir war ein </div> an einer falschen stelle.
derber bockmist!

dann hätt ich noch eine frage.
in deinem beispiel:
<html>
<head>
<style type="text/css">
#page { border: 1px solid #000; }
#header { background-color: #0f0; height:200px; }
#box1 { width:350px; height:300px; background-color: #0ff; float:left; }
#box2 { width:350px; height:300px; background-color: #f00; float:left; }
.clearer { clear:both; }
</style>
</head>
<body>
<div id="page">
<div id="header">header</div>
<div id="box1">box 1</div>
<div id="box2">box 2</div>
<br class="clearer" />
</div>
</body>
</html>könnt ich jetzt in box1 eine textbox setzten?

wie genau mach ich das? dann einfach neuen div und über absolute oder relative position ?

ich habe mir in der page jetzt unterhalb meines headers 2 boxen erstellt.
ich möchte jeweils in jede extra ein feld, welches leicht durchsichtig ist, etwas kleiner also die box und welches ich mit text füllen kann.

achso okay, aber ich möchte zum beispiel in meinen header eine navigation einbauen.
das menü möchte ich auf einer bestimmten größe haben und es im header selbst positionieren.
da ich es horizontal setzten möchte, würde ich einfach den inhalt mit display: inline; definieren.
nur ich versteh halt nicht, wie ich es im header frei setzten kann.

und sobald ich padding als eigenschaft für die box einstelle, verschiebt sich alles.. :-I
damn ich bin echt zu blöd...
muss mal nen kurs in der vhs besuchen :p