amlug: Bitte um Hilfe: Darstellungsfehler bei einzelnen Browsern

Beitrag lesen

Hallo allerseits,

ich eine von mir erstellte Webseite auf browsershots.org testen lassen. Dabei trat ein Darstellungsfehler im Menü der Seite (#nav) bei folgenden Browsern unter Win XP auf: Opera 7.54 und 8.54, Navigator 8.1.3, Internet Explorer 8.0.

Richtige Darstellung: http://img90.imageshack.us/img90/3550/richtiggk9.jpg
Falsche Darstellung: http://img90.imageshack.us/img90/7929/falschxy5.jpg

Hier der betreffende Code:

------------------------------------------------

* { margin: 0 auto; padding: 0 }  
  
body {	  
	background: url('images/design/bg2.jpg') top center no-repeat #fffff7;  
	font: normal 80% "Trebuchet MS", Arial, Georgia, sans-serif; }  
  
#site { width: 900px; }  
  
#nav {	  
	width: 898px;  
	background: url('images/design/navbg.jpg');  
	float: left;  
	margin: 0 auto; }  
	  
#nav ul { width: 784px; list-style-type: none; padding-left: 103px; margin: 0 auto; font-weight: bold; font-size: 0.9em; }  
#nav li { float: left; }  
#nav a { width: 114px; height: 28px; color: #afafaf; text-decoration: none; float: left; text-align: center; display: block; padding-top: 12px;}  
#active a { color: #ffffff; }  
#nav a:hover { color: #ffffff; }  
#nav li.one a:hover { background: url('images/design/nav_a1.jpg') no-repeat; }  
#nav li.two a:hover { background: url('images/design/nav_a2.jpg') no-repeat; }  
#nav li.three a:hover { background: url('images/design/nav_a3.jpg') no-repeat; }  
#nav li.four a:hover { background: url('images/design/nav_a4.jpg') no-repeat; }  
#nav li.five a:hover { background: url('images/design/nav_a5.jpg') no-repeat; }  
#nav li.six a:hover { background: url('images/design/nav_a6.jpg') no-repeat; }  
  
#header {  
	width: 828px;  
	height: 98px;  
	background: url('images/design/header.jpg');  
	padding: 0px 0px 0px 42px;  
	float: left;  
	margin: 0 auto; }  
...

------------------------------------------------

------------------------------------------------

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">  
  
<head>  
<meta http-equiv="Content-Language" content="de" />  
<link rel="stylesheet" type="text/css" href="stylesheet.css" />  
<title>Obst, Gem&uuml;se &amp; Oliven | Lebensart Naturkost</title>  
</head>  
	  
<body>  
<div id="site">  
  
	<div id="nav">  
		<ul>  
			<li class="one"><a href="index.html">Startseite</a></li>  
			<li class="two"><a href="aktuelles.html">Aktuelles</a></li>  
			<li class="three"><a href="laden.html">&Uuml;ber uns</a></li>  
			<li class="four" id="active"><a href="angebot.html">Unser Angebot</a></li>  
			<li class="five"><a href="imkerei.html">Imkerei</a></li>  
			<li class="six"><a href="anfahrt.html">Anfahrt</a></li>  
		</ul>  
	</div>  
	  
	<div id="header"></div>  
...

------------------------------------------------

Ich wäre sehr froh, wenn mir jemand einen Tipp geben könnte, wie dieser Darstellungsfehler zu beheben ist.

mfg amlug