Beste forum bezoeken ik heb een fout op mijn site in het bovenste menu. heb geen voorbeeld van de site maar de site is te download op onderstaande url. Als je met je muis over het menu gaat kijg je een dropdown en als je daan naar een menu item gaat verspringt de tekst. Weet iemand hier raadt mee?
http://www.bobbob.nl/webfout.rar

Groetjes,

Bob

Edit:
Hier de code:
css:

/* Header */

#header {
	width: 980px;
	height: 90px;
	margin: 0 auto;
}
/* Menu */

#menu {
	float: right;
}

#menu ul {
	margin: 0;
	list-style: none;
	line-height: normal;
}

#menu li {
	padding-left: 20px;
}

#menu a {
	text-transform: lowercase;
	text-decoration: none;
	font-weight: bold;
}

#menu a:hover {
	text-decoration: underline;
}

ul.dropdown ul {
	position: absolute;
	padding: 3px 6px;
	border: none;
	background-color: #FFFFFF;
	visibility: hidden;
}
ul.dropdown a, ul.dropdown span {
	display: block;
	padding: 4px 6px;
}
ul.dropdown, ul.dropdown li, ul.dropdown ul {
	list-style: none;
}
ul.dropdown {
	position: relative;
	float: left;
}
ul.dropdown li {
	float: left;
}
ul.dropdown li.hover, ul.dropdown li:hover {
	position: relative;
	
}
ul.dropdown ul li {
	float: none;
}
ul.dropdown li:hover > ul {
	visibility: visible;
}

de pagina:

<div id="header">
	<div id="logo">
		<h1><a href="#">Bobbob.nl</a></h1>
		<h2>Carp fishing, my way of life</h2>
	</div>
	<div id="menu">
		<ul id="nav" class="dropdown">
	<li><a>Algemeen</a>
		<ul>
			<li><a href="./">Home</a></li>
			<li><a href="./">Foto album</a></li>
			<li><a href="./">Links</a></li>
			<li><a href="./">Foto van de maand</a></li>
		</ul>
	</li>
	<li><a>Artikelen</a>
		<ul>
			<li><a href="./">Rigs & knopen</a></li>
			<li><a href="./">Aas & voer</a></li>
			<li><a href="./">Vis strategien/technieken</a></li>
			<li><a href="./">Vissen in Nederland</a></li>
			<li><a href="./">Vissen in Frankrijk</a></li>
			<li><a href="./">Vissen in het buitenland</a></li>
			<li><a href="./">Overige verhalen</a></li>
		</ul>
	</li>
	<li><a href="./">Forum</a></li>
	<li><a>Gebruiker</a>
		<ul>
			<li><a href="./">Bekijk profiel</a></li>
			<li><a href="./">Gegevens wijzigen</a></li>
			<li><a href="./">Afbeelding wijzigen</a></li>
			<li><a href="./">Wachtwoord wijzigen</a></li>
		</ul>
	</li>
	<li><a href="./">Nieuws</a></li>
	<li><a href="./">Contact</a>
		<ul>
			<li><a href="./">Vragen</a></li>
			<li><a href="./">Foto opsturen</a></li>
			<li><a href="./">Artikel opsturen</a></li>
			<li><a href="./">Adverteren</a></li>
		</ul>
	</li>
</ul>
	</div>
</div>


EDIT: Probleem opgelost
Ik zou toch graag willen dat je even ergens een online voorbeeldje hebt. Of iig gewoon via hier de code geeft (alleen relevant).
Ken het probleem, weet alleen niet exact wat erachter mis was, vaak een foute margin/padding/positioning. :)

Maarja, ik ga liever niets downloaden. Kan je het niet gewoon online plaatsen?
Heb de code toegevoegd ;-)
Ik mis op het eerste gezicht al li { float: left; } of li { display: inline;}. Geen idee welke browser je gebruikt, maar in IE krijg je dan een "inspring" effect waardoor ze rechtsonder elkaar gaan stapelen.

Geen visibility gebruiken, maar display: none; en display: block;. Maak je ul/li dropdown ook eens in een vaste breedte inplaats van ieder blokje zijn eigen grootte te laten hebben op basis van content.

Na dit aan te hebben gepast, zeg dan maar of het probleem er nog is. :)
Voorbeeldje werkt niet en overigens ook al werkt het niet, die manieren die ik opnoem zijn toch the way 2 go. Als je het op de manier blijft doen zoals je nu doet, dan gaat het nooit werken of zal het lelijk worden. ;)
Ik heb het toegevoegd maar ik heb nog steeds het probleem.
Sorry had een type foutje gemaakt in de link, zie hier de goede link:
http://www.bobbob.nl/bobbob/

Groetjes
Ik krijg helemaal geen submenu... ? Dus verspringen doet het ook niet :)
Welke Browser gebruik je? Hier in FF 3.x merk ik er niets van. Alhoewel, je wel een rare (grote) padding/margin aan de linker kant hebt.
ik gebruik IE maar het probleem doet zig voor als je in het bovenste menu boven de header bent en dan op een woord gaat staan zodat je de drop down krijgt en dan met je cursor over een menu item gaat.

Reageren