• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Content-Bereich wird nicht zentriert... -.-

K

kaykay16

Neues Mitglied
Juten morgen meine webfreunde...
hab die ganze Nacht schon dran gefummelt und raste bald aus...
Für eine Discothek aus meinem Ort möchte ich eine HP schreiben und habe die Grafiken soweit fertig...
dann angefangen zu schreiben:
style.css erstellt... index.html erstellt... images Verzeichnis angelegt und los...
header eingefügt... klappt... zentriert
Navi eingefügt... klappt... zentriert
content eingefügt... BÄÄM... linksbündig... egal was ich mache... ich bekomme es nicht zentriert...

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>Club le Baron</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>



<body>

<div id="container">
  <div id="head">
  	</div>
    
    <div id="menu"><a href="index.html"><img src="images/menu_01.gif" width="150" height="53" /></a><a href="partypics.html"><img src="images/menu_02.gif" width="203" height="53" /></a><a href="events.html"><img src="images/menu_03.gif" width="160" height="53" /></a><a href="guestbook.html"><img src="images/menu_04.gif" width="208" height="53" /></a><a href="videos.html"><img src="images/menu_05.jpg" width="149" height="53" /></a>
    </div>    
</div>

<div id="middle">
	<div id="middle2">
		<div id="content">
    		
   		</div>
	</div>
</div>


</body>
</html>

hier der CSS Code:

Code: 
* {
	margin: 0px;
	padding: 0px;
}

body {
	padding-top: 0px;
	background-color: #01111d;
	color: #FFF;
	font-family: verdana, arial, sans-serif;
	
	text-align: left;
	letter-spacing: 1px;
}

a {color: #FFF;font-size: 14px;}

a:hover {color: #01a9c0;}

.more{float: right; font-size: 11px; color: #add8f9; font-weight: bold; text-decoration: none;}

.clear{clear:both;}

p{	margin: 20px 0px 20px 0px;line-height: 16px;font-size: 14px;}

#container {
	margin: 0px auto;
	width:870px;
}

#head {
	background-image:url(images/header.png);
	width:870px;
	height:250px;
	position:relative;
}

#menu {
	background-image:url(images/menu.jpg);
	width:870px;
	height:53px;
	position:relative;
}

#m01{left:30px;}
#m02{left:150px;}

#menu a{
	font-family: georgia, sans-serif;
	font-size: 20px;
	font-weight:bolder;
	color:#FFFFFF;
	text-decoration:none;
	text-transform: uppercase;
}

#middle {
	background-image:url(images/middle.jpg);
	width:870px;
	height:16px;
}

#middle2 {
	background-image:url(images/middle2.jpg);
	width:870px;
	height:15px;
}

#content {
	background-image:url(images/content.jpg);
	width:870px;
	height:16px;
}

wo hab ich da was falsch gemacht??? :oops:
 
Aufgrund der Verschachtelungen musst du das übergeordnete #middle zentrieren oder die Verschachtelung ändern.

In diesem Bereich ist allerdings überhaupt nichts zentriert, da das erforderliche
Code: 
margin: 0 auto;
fehlt.
 
ja cool danke das hat schon mal funktioniert...
ein Problem gelöst, folgt gleich das nächste...xD
nun will ich meinen content-bereich in zwei teile aufteilen...
in CSS die Variablen left und right...
Codes:
Code: 
#left {
	float:left;
	width:430px;
	margin: 0px 0px 0px 20px;
	display:inline;
}

#right {
	float:right;
	width:350px;
	height:auto;
	margin: 0px 62px 20px 0px;
	display:inline;
}

nun wird allerdings die Backgroundgrafik der Variable #content bzw #middle nicht weitergeführt...
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben