titel komt niet in het midden

Status
Niet open voor verdere reacties.

xLioness

Gebruiker
Lid geworden
11 sep 2011
Berichten
47
Hoe krijg ik de titel in het midden? want zoals ik het nu heb staat het rechts achter mijn menu, waar ik het dus niet wil hebben.

dit is de CSS:
Code:
@charset "utf-8";
/* CSS Document */

body {
	background-color: #FFFFFF;
	}

#header {
	display: block;
	width: 1000px;
	height: 175px;
	background-image: url(../header.png);
	margin-left: auto;
	margin-right: auto;
	}

#menu {
	padding: 0;
	margin: 0 auto;
	width: 540px;
	}

#menu li {
	float: left;
	height: 25px;
	list-style-type: none;
	padding: 0;
	margin: 0;
	}

#menu li a {
	display: block;
	font: 900 9pt arial;
	width: 125px;
	text-align: center;
	color: #ffffff;
	text-decoration: none;
	background-image:url('../Images/Button.png');
	padding: 4px 4px;
	border-right: 2px solid white;
	}

h1 {
	text-align: center;
	width: 100%;
}
 
Dit heb ik nu, maar het werkt nog steeds niet. kan iemand me vertellen waar de fout zit?

Code:
@charset "utf-8";
/* CSS Document */

body {
	background-color: #00FFFF;
	text-align: center;
	}

#header {
	display: block;
	width: 1000px;
	height: 175px;
	background-image: url(../header.png);
	margin-left: auto;
	margin-right: auto;
	}

#menu {
	padding: 0;
	margin: 0 auto;
	width: 540px;
	}

#menu li {
	float: left;
	height: 25px;
	list-style-type: none;
	padding: 0;
	margin: 0;
	}

#menu li a {
	display: block;
	font: 900 9pt arial;
	width: 125px;
	text-align: center;
	color: #ffffff;
	text-decoration: none;
	background-image:url('../Images/Button.png');
	padding: 4px 4px;
	border-right: 2px solid white;
	}

h1 {
	margin-left: auto;
	margin-right: auto;
	width: 800px;
}

#footer {
	Margin-left: auto;
	margin-right: auto;
}
 
Valt weinig over te zeggen zonder de hele site te zien. Nu weten we maar de helft van het verhaal.
 
ik heb hier ook nog de HTML
het staat nog niet online, dus ik kan niet echt iets laten zien

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" type="text/css" href="css/style.css" />
	<title>
    	Titel
    </title>
</head>

<body>

	<div id=header></div>

	<ul id=menu>
       	<li><a href="1.html">Index</a></li>
		<li><a href="2.html">link 1</a></li>
		<li><a href="3.html">Link 2</a></li>
		<li><a href="4.html">Link 3</a></li>
    </ul>

	<div id=content>
		<h1>
        	Head
        </h1>
	</div>

	<div id=footer>
    	<p>
			&copy; 2011 <br />
        </p>
	</div>

</body>

</html>
 
Als je clear:both; aan te #content meegeeft moet de titel goed komen te staan. Nu weet hij niet hoe breed hij moet zijn dus hij gaat op de eerste de beste plek zijn war ruimte is, rechts van het menu.

Je moet ook even overflow:auto; meegeven aan je #menu, zodat dat goed wordt weergegeven.
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan