Webstandards feat. Iexplorer

Pseiko

Hallo,

ich bekomme es nicht hin, eine Tablelle in Firefeox, Opera und dem IE (halbwegs gleich) hinzubekommen. Genaugenommen sieht sie in Opera und Firefox (ziemlich) gleich aus, nur der IE tanzt aus der Reihe.

Habe schon alles mögliche versucht:

margin:0px;
padding:0px;

aber ich bekomme die Zeilenabstände nicht einheitlich hin.

Gibt es überhaupt eine Mögleichkeit die Zeilenabstände im IE zu verringern?

(Siehe angehängtes Bild)

Gruß
Christian

Ronald

Hi,

zeig mal den Quelltext für die Navigation.
Der IE interpretiert Maßangaben anders, als es nach W3C sein sollte.

Gruß aus der Marsch!

Ronald

Pseiko

Code

<div id="rechts">
	<table class="menu_tabs">
		<tr>
			<td class="navi">
				<table class="menu_tabs">
					<tr>
						<td class="navi_ueber">


							<span class="Menu_uebersch">Navigation</span>
						</td>
					</tr>
					<tr>
						<td>
							[url='www.test.de']Startseite[/url]
						</td>
					</tr>


					<tr>
						<td>
							[url='www.test.de']Gästebuch[/url]
						</td>
					</tr>
					<tr>
						<td>
							[url='www.test.de']Forum[/url]


						</td>
					</tr>
					<tr>
						<td>
							[url='www.test.de']Statistik[/url]
						</td>
					</tr>
					<tr>


						<td>
							[url='www.test.de']Disclaimer[/url]
						</td>
					</tr>
					<tr>
						<td>
							[url='www.test.de']Impressium[/url]
						</td>
					</tr>
				</table>
			</td>
		</tr>
	</table>
</div>

Alles anzeigen

CSS:

.menu_tabs {
margin:0px;
padding:0px;
}
.navi {
width:130px;
border-width:1px;
border-style:solid;
border-color:#4472B2;
}
.navi_ueber {
background-color:#4472B2;
width:128px;
}
.menu_uebersch {
font-weight:bold;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
.Menu_links {
color:#D5DBB3;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}[/code]

Ronald

Also ich habe das mal in eine Testseite gepackt und dann mit den verschiedenen Browsern betrachtet. Ergebnis: alle Tabellen sehen fast identisch aus, beim IE ist die Überschrift "Navigation" etwas kleiner, die Schriften der Links sind 100% identisch.

Die Tabellen selbst haben auch fast die gleiche Grölße (am Rahmen gemessen):
Firefox: 134 x 136 Pixel
IE: 138 x 132 Pixel
Opera: 134 x 137 Pixel

Diese Werte sind so minimal unterschiedlich, daß man sie vernachlässigen kann. Wenn bei dir die Abweichungen größer sind, dann würde ich gerne mal den kompletten Quelltext der Seite bzw. besser die Seite online sehen, eventuell haben sich da andere Fehler eingeschlichen.

Gruß aus der Marsch!

Ronald

Pseiko

Kommt sofort:

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<link rel="stylesheet" type="text/css" href="data/page.css">
<meta http-equiv="Content-Type"
    content="text/html; charset=ISO-8859-1" >
	<title>bla</title>
<style type="text/css">
</style>
</head>
<body id="body">
<div id="root">
<div id="oben">
	oben
</div>


<div id="mitte">
	blabla Inhalt
</div>
<div id="rechts">
	<table class="menu_tabs">
		<tr>
			<td class="navi">
				<table class="menu_tabs">
					<tr>
						<td class="navi_ueber">


							<span class="Menu_uebersch">Navigation</span>
						</td>
					</tr>
					<tr>
						<td>
							[url='www.test.de']Startseite[/url]
						</td>
					</tr>


					<tr>
						<td>
							[url='www.test.de']Gästebuch[/url]
						</td>
					</tr>
					<tr>
						<td>
							[url='www.test.de']Forum[/url]


						</td>
					</tr>
					<tr>
						<td>
							[url='www.test.de']Statistik[/url]
						</td>
					</tr>
					<tr>


						<td>
							[url='www.test.de']Disclaimer[/url]
						</td>
					</tr>
					<tr>
						<td>
							[url='www.test.de']Impressium[/url]
						</td>


					</tr>
				</table>
			</td>
		</tr>
	</table>
</div>
	<br style="clear:both;" />
</div>
</body>
</html>

Alles anzeigen

#oben {
height:80px;
overflow:hidden;
background-color:#171656;
}
#mitte {
top:85px;
width: 76%;
float:left;
background-color:#171656;
}
#rechts {
float: right;
background-color:#171656;
top:85px;
right:0px;
width:150px;
}
#body {
background-color:#171656;
}

.menu_tabs {
margin:0px;
padding:0px;
}
.navi {
width:130px;
border-width:1px;
border-style:solid;
border-color:#4472B2;
}
.navi_ueber {
background-color:#4472B2;
width:128px;
}
.menu_uebersch {
font-weight:bold;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
.Menu_links {
color:#D5DBB3;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}

Danke für deine Mühe

Gruß
Christian

Ronald

Also ich habe die gleichen Abweichungen wie zuvor, eben nur 3-4 Pixel je nach Browser. Da hat sich nichts verändert, im übrigen pixelgenau identisch mir deiner geposteten Grafik (gilt für Opera und Firefox).

Es muß also irgendwie an deinen Browsereinstellungen (IE) liegen, wenn es bei dir anders angezeigt wird. Betrachtest du das ganze lokal oder online ?

Mir fällt sonst nichts mehr ein, denn so wie ich hes zu s ehen bekomme ist es identisch innerhalb einer normalen Toleranz.

Gruß aus der Marsch!

Ronald

Pseiko

Hmm, seltsam.

Ich habe am IE eigentlich keine Einstellungen verändert, da ich ihn normalerweise nicht benutze.

Die Dateien betracht ich mir lokal.

Gruß

Christian

Ronald

Zitat von Pseiko

Die Dateien betracht ich mir lokal.

Also vermutlich ganz normal unter Windows, oder hast du einen lokalen Server (Apache) installiert?

Lade das ganze mal auf einen Webspace und schau es dir dann an, ich vermute daß Windoof dir seinen eigenen Zeiichensatz unterjubelt und damit alles durcheinander bringt.

Vom Quelltext her ist es jedenffalls i.O.

Gruß aus der Marsch!

Ronald

Ich hab das ganze über Xampp laufen (da Php).

Sobald ich am Montag wieder in Reichweite meines Rechners bin, werde ich es mal online testen.

Gruß
Christian

Webstandards feat. Iexplorer

Tags

Benutzer online in diesem Thema