Differenz bei der Darstellung im Firefox 6 und Chrome 14

[ne0hype]

Hi,

ich habe seit eine ganzen Weile ein Layout erstellt. Dieses habe ich auf den damaligen Firefox 3 und auf Chrome und IE angepasst.

Nun ist mir aufgefallen, dass beim neuen Firefox 6.0.2 die Darstellung nicht mehr passt. Ich wollte deshalb mal fragen woran das liegt und ob man jetzt sogar schon für Firefox eine eigene Stylesheet Datei braucht.

Im Anhang findet ihr den Vergleichstest.

Komisch ist, dass in beiden Browsern die Höhe des "h"'s genau 9 px ist. Auch das "p" weisst in beiden Browsern eine Höhe von 8px auf. Lediglich der Abstand zum "padding"-Begin ist ein anderer.

Hier mal den HTML Code:

<ul class="clearfix" id="nav">
		<li><a href="#">Konfiguration</a>
			<ul>
				<li><a href="/triwala/backend/configs/my-account/">Mein Account</a></li>
				<li><a href="">Seiteneinstellungen</a></li>
				<li><a href="">Datenbank-Backup</a></li>
			</ul>
		</li>
		<li><a href="/triwala/backend/whitepage">Whitepages</a></li>
        	
	</ul>

und der dazu gehörige CSS:

#nav {
	margin-top: 	1px;
	background: 	url(const(baseUrl)/images/layout/nav_bg.gif) repeat-x;
	float:			left;
	font-weight: 	bold;
	margin: 		0 0 4px 0;
}
#nav li {
	float: 			left;
	list-style: 	none;
	padding: 		0;
}
#nav a {
	color: 				white;
	display: 			block;
	text-decoration: 	none;
	padding: 			10px 18px;
}
#nav li ul {
	position: 			absolute;
	left: 				-999em;
	height: 			auto;
	width: 				13.9em;
	font-weight: 		normal;
	margin: 			0;
	background:			url(const(baseUrl)/images/layout/naviation-transparent-background.png);
}
#nav li li {
	padding-right: 		1em;
	width: 				12.9em
}
#nav li ul a {
	display: 			block;
	width: 				12em;
	padding: 			5px 0 5px 18px;
	border-left:		1px solid #0E0F15;
}
#nav li ul ul {
	margin: 			-2.1em 0 0 12.9em;
}

Grüße
ne0hype

 

[ne0hype]

Weiß keiner bescheid?