Frage stellen
kann mir jemand weiterhelfen?
ich möchte gerne mein menü auf der seite zentrieren, weiß aber nicht, wie ich das bewerkstelligen soll.
danke für euren input!
- Code: Alles auswählen
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Website</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="container">
<div id="header">
<h1>test</h1>
</div>
<div id="mainnav">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Links</a></li>
<li><a href="#">Documents</a></li>
<li><a href="#">Help</a></li>
<li><a href="#">Tutorials</a></li>
</ul>
</div>
<div id="menu"></div>
<div id="content">blablabla</div>
<div id="footer"><a href="#">Impressum</a> <a href="#">Contact</a></div>
</div>
</body>
</html>
- Code: Alles auswählen
body {
margin: 0px;
padding: 0px;
font-family: verdana;
text-align: center;
}
#container {
border: solid 1px;
margin: 1em auto;
background-color: yellow;
height: 900px;
width: 800px;
}
#header {
text-align: left;
background-color: green;
height: 120px;
}
#header h1 {
margin: 0;
padding: 0;
}
#mainnav {
height: 30px;
background-color: black;
text-transform: uppercase;
font-size: 0.8em;
font-weight: bold;
}
#mainnav a:link, #mainnav a:visited {
display: block;
line-height: 30px;
padding:0 30px 0 30px;
color: white;
text-decoration: none;
}
#mainnav a:hover, #mainnav a:active {
color: orange;
}
#mainnav ul {
margin: 0;
padding: 0;
list-style-type: none;
}
#mainnav ul li {
float: left;
}
#menu {
float: left;
height: 720px;
background-color: white;
width: 150px;
}
#content {
padding: 30px;
text-align: left;
margin-left: 150px;
background-color: teal;
height: 660px;
width: 590px;
}
#footer {
padding-left: 20px;
text-align: left;
background-color: silver;
height: 30px;
width: 780px;
}
#footer a:link, #footer a:visited {
color: white;
text-align: center;
line-height: 30px;
text-decoration: none;
}
#footer a:hover, #footer a:active{
}
