Probleme der zentrierten Ausrichtung

Ich habe jetzt meine Seite mal durch folgenden Doctype ergänzt und habe leider immer noch keine gleichen Ergebnisse.

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
Dann hast du deine Seite(n) offensichtlich bislang nicht W3C-standardkonform entwickelt.

So, habe jetzt mal ein wenig rumprobiert und habe festegestellt, das die Tabellenzelle der Navigationsbuttons zu groß gemacht wird. Ich kann mir das einfach nicht erklären, habe alle Buttons jetzt in eine Tabelle gepackt, hat aber auch nix geändert. Als wäre hinter der Grafik noch nen Zeilenumbruch und dann ein Leerzeichen oder so.

HTML:
	<tr>	 
		<td colspan="4" style="height: 58px">
		<table class="normal" cellpadding="0" cellspacing="0">
		<tr>
			<td><img src="http://www.tutorials.de/images/06.png" width="263" height="58" onMouseOver="showMenu('menu1', this)"></td>
			<td><img width="173" height="58" src="http://www.tutorials.de/images/07.png"></td>
			<td><img src="http://www.tutorials.de/images/08.png" width="208" height="58"></td>
			<td><img src="http://www.tutorials.de/images/09.png" width="155" height="58"></td>
		</tr>
		</table>
		</td>
	</tr>

Nehme ich die Tabelle komplett raus, stimmt das Layout wieder und die Höhe von 190px wird nicht überschritten. Sind die Grafiken drinne, liegt die Höhe bei ca. 195px. Dadurch die Verschiebung.
:( Bin verwirrt...

Versuch es mal dieser CSS-Regel, damit die Browser nicht möglicherweise die Whitespaces im HTML-Code fehlinterpretieren, die solch eine Verschiebung / Lücke im Textfluß zur Folge haben.

CSS:
img { display:block; }

Übrigens vielen Dank für deine aufschlußreiche Antwort zu meiner zuletzt gestellten Frage.

Bei soviel entgegengebrachter Ignoranz bin ich hier dann ganz gediegen und geschmeidig raus, und katapultiere deinerneier zum Dank ebenbürtig in meine persönliche Ignorieliste :p
 
Zuletzt bearbeitet:
Danke, ich schau mir das gleich mal an.

Ich habe deine Frage doch "quasi" beantwortet. Schau dir meine Screenshots an, dann siehst du was ich meine. Warum es auf deinen beiden Screen's "scheinbar" gleich ausschaut, kann ich mir wenn nur durch die Version erklären (5.0.2 bei mir). Wie du auf dem Screen vom Safari siehst, positioniert er das Element nicht dort, wo es sein sollte!
Macht das OS einen unterschied?

Dann hast du deine Seite(n) offensichtlich bislang nicht W3C-standardkonform entwickelt.
Du hast mich erwischt... ich habe grade zum ersten Mal den Test mit Passed bestanden... hab grade schon ne Flasche Sekt geöffnet ;)

EDIT
Die CSS-Regel bewirkt seltsame Dinge im gesamten Layout.
Verwende den Doctype der bei SelfHTML angegeben ist

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Damit funktioniert die Darstellung der Tabellen wieder akkurat. Nur setzt FF und Opera das erste Bild der Slideshow richtig und IE und Safari falsch. Der Safari rechnet für die Position des Elementes den min-width Wert dazu, der IE nicht.

EDIT2
Ich vermute deine Bildschirmauflösung ist zu gering, als das bei dir der Fehler sichtbar wird. Skaliere ich mein Safarifenster auf die "minimale" Auflösung, dann scheint es "scheinbar" richtig zu sein.
 
Zuletzt bearbeitet:
Zurück