dropdown menu zelfde breedte als menu's

[jappertjeh]

Hallo mede helpmijers,

Ik heb een dropdown menu op mijn site gezet, maar nu zijn de menuutjes die uitklappen niet even breed als de titel van dat menu. Kan iemand mij helpen dat aan te passen? Hieronder een voorbeeld:



Je ziet dat het menu wat ik aangewezen heb, breder is dan link 1 zelf.. Als ik bijvoorbeeld op die link 1 link 1 link 1 enz. wijs, is hij weer smaller dan het menuutje zelf. Ik wil graag dat dit even breed is maar krijg dit nergens aangepast. Heb de css en html van internet geplukt.

CSS:

#drop-down-menu{margin-left:20px;
				height:25px;
				padding-top:7px;
}
				
	ul{
		font-weight:bold;color:#ffffff;
		margin:0;
		padding:0;
		list-style:none}
	ul li{
		display:block;
		position:relative;
		float:left;
	}
	li ul{display:none}
	ul li a{
		display:block;
		margin-left:0px;
		text-decoration:none;
		color:#ffffff;
		padding: 5px 15px 5px 15px;

		white-space:nowrap}
	ul li a:hover{color:inherit}
	li:hover ul{ 
		display:block; 
		position:absolute}
	li:hover li{ 
		font-size:70%;
		clear:left; 
		width:12em}
	li:hover a{ background:#016daf;color:inherit; }
	li:hover li a:hover{background:#6ab9e4; border:solid 1px #fff;color:inherit;}
	.clear_all{clear:both;height:0.5em;}

en de HTML:

<div id="menubalk"><ul id="drop-down-menu">
	<li><a href="http://kompoos.nl/css/text-effects/drop-down-menu.html">Link 1</a></li> 
	<li><a href="http://kompoos.nl/css/text-effects/drop-down-menu.html">Link 1</a> 
		<ul>
			<li><a href="http://kompoos.nl/css/text-effects/drop-down-menu.html">drop down menu 1</a></li>
			<li><a href="http://kompoos.nl/css/text-effects/drop-down-menu.html">drop down menu 2</a></li> 
			<li><a href="http://kompoos.nl/css/text-effects/drop-down-menu.html">drop down menu 3</a></li> 
		</ul> 
	</li> 
	<li><a href="http://kompoos.nl/css/text-effects/drop-down-menu.html">Link 1</a> 
		<ul> 
			<li><a href="http://kompoos.nl/css/text-effects/drop-down-menu.html">drop down menu 1</a></li> 
			<li><a href="http://kompoos.nl/css/text-effects/drop-down-menu.html">drop down menu 2</a></li> 
			<li><a href="http://kompoos.nl/css/text-effects/drop-down-menu.html">drop down menu 3</a></li> 
			<li><a href="http://kompoos.nl/css/text-effects/drop-down-menu.html">drop down menu 4</a></li> 
		</ul> 
	</li>
	<li><a href="http://kompoos.nl/css/text-effects/drop-down-menu.html">link link link link</a> 
		<ul> 
			<li><a href="http://kompoos.nl/css/text-effects/drop-down-menu.html">drop down menu 1</a></li> 
			<li><a href="http://kompoos.nl/css/text-effects/drop-down-menu.html">drop down menu 2</a></li> 
			<li><a href="http://kompoos.nl/css/text-effects/drop-down-menu.html">drop down menu 3</a></li>
			<li><a href="http://kompoos.nl/css/text-effects/drop-down-menu.html">drop down menu 4</a></li> 
			<li><a href="http://kompoos.nl/css/text-effects/drop-down-menu.html">drop down menu 5</a></li> 
		</ul> 
	</li> 
	<li><a href="http://kompoos.nl/css/text-effects/drop-down-menu.html">Link 1Link 1Link 1Link 1Link 1</a></li> 
	<li><a href="http://kompoos.nl/css/text-effects/drop-down-menu.html">2</a></li> 

</ul>	
<p class="clear_all"></p></div></div>

alvast bedankt!

 

[cookies]

Wanneer je in css in definitie van "ul li a{" de volgende tag toevoegt "width:200px;" krijgen alle menu's een breedte van 200 pixels. De tekst van het menu item mag dan niet breder zijn dan 200 pixels. Je kan de waarde 200px natuurlijk in iedere gewenste breedte aanpassen.

 

[pum]

..

 

[pum]

ik had een oplossing gepost, maar bleek dat ik de vraag verkeerd had gelezen. was niet wat je zocht. Op een of andere manier kon ik mij post niet verwijderen zonder iets nieuws te posten, het moest minimaal 2 tekens lang zijn en .. is precies 2