CSS menu

Door Kanter van Deurzen op 07-04-2006 22:11

2.448 views

Hoi,

Ik heb een probleempje. Ben een pagina van me aan het omzetten van tabellen naar CSS. Ik heb alleen een probleem met een horizintaal menu. De informatie voor het menu wordt uit een database gehaald door middel van een PHP script. Maar als ik de link's uit de database haald vullen de knoppen automatische het hele scherm.

Ik heb nu:


<div id="wrapper">
<!--Start of header-->
<div id="header">
<h1>titel</h1>
<!--Start of Menu-->
<div id="nav">
<ul
><li>><a href="index3.php?type=<?php echo $button1 ?>"><?php echo $button1 ?></a></li
><li><a href="index3.php?type=<?php echo $button2 ?>" ><?php echo $button2 ?></a></li
><li><a href="index3.php?type=<?php echo $button3 ?>" ><?php echo $button3 ?></a></li
><li><a href="index3.php?type=<?php echo $button4 ?>" ><?php echo $button4 ?></a></li
><li><a href="index3.php?type=<?php echo $button5 ?>" ><?php echo $button5 ?></a></li
></ul>
</div>
<!--End of Menu-->
</div>
<!--End of header-->
<div id="content"></div>
</div>

met als css:


html, body, ul, ol, li, p, h1, h2, h3, h4, h5, h6, form, fieldset {
	margin: 0;
	padding: 0;
	border: 0;
}

body{
	scrollbar-3dlight-color: #000000;
	scrollbar-arrow-color: #000000;
	scrollbar-base-color: #FFFFFF;
	scrollbar-darkshadow-color: #000000;
	scrollbar-face-color: #FFFFFF;
	scrollbar-highlight-color: #ffffff;
	scrollbar-shadow-color: #ffffff;
	background-color:#CCCCCC;
}

#wrapper{
	width:656px;
	margin:10px auto;
}

#header{
	background-image: url(../1.jpg);
	height: 120px;
	background-repeat:no-repeat;
	overflow:hidden;
}

#header h1{
	float:right;
	margins-top: 25px;
	margin-right: 11px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 33px;
	font-weight: bold;
	color:#FFFFFF;
}

#header #nav{
	border-bottom: 1px solid #FFFFFF;
	margin-top: 73px;
	margin-left: 11px;
}

#header #nav ul{	
	margin: 0; 
	padding: 0;
	background-color:#009900;
	height: 15px;
}

#header #nav ul li{
	display: inline;
	margin: 0px;
	padding: 0;
	width: 30px;
}

#header #nav ul li a{
	font-size: 11px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	border-right: 1px solid #000000;
	display: block;
	padding: 2px 10px;
	text-decoration: none; 
	height: 1%;	
	color:#FFFFFF;
}

#content{
	margin:10px 10px auto 0;
	background-color:#FFFFFF;
	border: 1px solid #000000;
}

BvD,
Toby

#nav ul{ margin: 0; padding: 0; background-color:#009900; height: 15px; list-style-type: none; } #nav ul li{ display: inline; margin: 0px; padding: 0; } #nav ul li a{ font-size: 11px; font-family: Verdana, Arial, Helvetica, sans-serif; border-right: 1px solid #000000; display: block; padding: 2px 10px; text-decoration: none; height: 1%; color:#FFFFFF; }