div(s)webseite zentrieren

Bueny

Grünschnabel
Hallo,

zunächst verzeihung wenn es den Thread schon gibt.. Suchanwendung hat mein Problem nicht gelöst. Ich bin noch nicht so erfahren in sachen CSS nehme aber doch an das mein Problem darin liegt. Ich würde meine Seite gerne in der Mitte zentriert haben.. Ich habe auch schon mehrere Varianten, die mir eingefallen sind versucht leider ohne gewünschtes Ziel.. Im <body> hab ich auch versucht einen margin-left mit 20% anzugeben was allerdings auf unterschiedlichen Rechnern unterschiedliche Resultate erbringt...

Über den Code bitte nicht meckern wenn er leicht "angesaut ist". Das <table> und <td> hab ich wider Willen gemacht und bin gerne bereit das durch div zu ersetzen.

hier der HTML Code:

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<title>Bueny</title>
<link href="stylesheet.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<table><td>
<div id="headup"></div>
<div id="navb">
  <a href="about.php"><img src="pics/about.png" width="194" height="43" alt="" border="0" ></img></a><a href="gallery.php"><img src="pics/gallery.png" width="172" height="43" alt="" border="0"></img></a><a href="news.php"><img src="pics/news.png" width="156" height="43" alt="" border="0"></img></a><a href="friends.php"><img src="pics/friends.png" width="165" height="43" alt="" border="0" ></img></a><a href="contact.php"><img src="pics/contact.png" width="191" height="43" alt="" border="0"></img></a></div>
<div id="contenta"></div>
<div id="content">Etabiliter Erogo villa periclitatus, for in per no sors capulus se Quies, mox qui Sentus dum confirmo do iam. Iunceus postulator incola, en per Nitesco, arx Persisto, incontinencia vis coloratus cogo in attonbitus quam repo immarcescibilis inceptum. Ego Vena series sudo ac Nitidus. Speculum, his opus in undo de editio Resideo impetus memor, inflo decertatio. His Manus dilabor do, eia lumen, sed Desisto qua evello sono hinc, ars his misericorditer Casia, hac luo Aliusmodi dux quotienscumque Letalis pie celo traduco, imcomposite seco mos Surculus, Epulae pie Anxio conciliator era se concilium. Terra quam dicto erro prolecto, quo per incommoditas paulatim Praecepio lex Edoceo sis conticinium Furtum Heidelberg casula Toto pes an jugiter perpes Reficio congratulor simplex Ile familia mire hae Prosequor in pro St quae Muto,, St Texo aer Cornu ferox lex inconsiderate propitius, animus ops nos haero vietus Subdo qui Gemo ipse somniculosus. Non Apertio ops, per Repere torpeo penintentiarius Sy.</div>

</td></table>
</body>
</html>

Hier nun der CSS-Code:

Code:
body {
			font-family: Arial, Helvetica, sans-serif;
			background:#000000;
			text-align:center;
			margin-top:0;
}
#headup {
			width:878px;
			height:154px;
			background:url(pics/head.png);
			font-size: 12px;
}

#navb {		
			background:#000000;
			width:878px;
			height:43px;
}
#contenta {
			width:878px;
			height:227px;
			background:url(pics/contenta.png);
}


/* #contentb {
			width:878px;
			height:227px;
			background:url(pics/contentb.png);
}
#contentc {
			width:878px;
			height:227px;
			background:url(pics/contentc.png);
}
#contentd {
			width:878px;
			height:227px;
			background:url(pics/contentd.png);
}
#content {	
			width:848px;
			background:#000000;
			text-align:left;
			color: #CCC;
			padding: 15px;
}

#wrapper {
			width:878px;
			margin-left:20%;
} */

Der kommentierte Code ist für später da wenn ich das Problem mit dem Zentrieren gelöst habe. "Wrapper" war ursprünglich ein Versuch
 
Hi,

ersetze die umschliessende Tabelle durch einen weiteren DIV-Block (<div id="wrapper">...</div>), und formatiere diesen wie folgt:

CSS:
#wrapper {
width:878px;
margin:0 auto; /* der zweite Wert "auto" sorgt für die horizontale Zentrierung */
}

mfg Maik
 
Zurück