nicht angemeldet
validirte Seite sieht in IE anders aus als in Mozilla
Schön guten Morgen,
also, ich hab alle eure Tipps befolgt. Hab jetzt ne kleine Seite gemacht, die Elemente mit HTML, deren Formatierung rein mit CSS, und habs validiert. Keine Fehler! Das Problem ist, dass die Seite nun in nem anderen Browser auch anders aussieht. Im IE sieht alles okay aus, im Mozilla nicht, oder umgekehrt. Je nach dem wie ich das Bild positioniere (das ist der Fehler).
Denn damit das Bild an der korrekten stelle sitzt, muss ich für den IE top:107px; left:107px eintragen und für Mozilla andere Werte. Das geht aber nicht. Was soll ich nun machen?
http://test.compmess.net/index.php
Gruß Giovanni
-
Tut mir leid, vertippt, Thema nicht Java, sondern HTML/CSS.
Gruß Giovanni
-
also, ich hab alle eure Tipps befolgt. Hab jetzt ne kleine Seite gemacht, die Elemente mit HTML, deren Formatierung rein mit CSS, und habs validiert. Keine Fehler! Das Problem ist, dass die Seite nun in nem anderen Browser auch anders aussieht. Im IE sieht alles okay aus, im Mozilla nicht, oder umgekehrt.
Es ist zwar fein, daß Du Dich an die Syntax hältst, aber das ändert nichts daran, daß die Art der Nutzung von HTML und CSS eine Katastrophe ist. Für Puristen schlimm genug ist schon, daß Du <table> als Konstrukt für einen Rahmen gebrauchst, Du setzt dem aber noch einen oben drauf und mißbrauchst CSS dazu, die Unzulänglichkeiten dieses Tabellenlayouts auszubügeln, indem Du ein <div>-Element als Grafik auf eine Ecke der Tabelle platzierst.
So gesehen solltest auf CSS besser komplett verzichten, schon alleine weil das weitaus einfacher mit einer althergebrachten HTML-Tabelle geht:
Ecke | Rahmen oben
-------+-------------
Rahmen |
links | Ein TextAber das möchtest Du sicher nicht, darum gehen wir mal dem Kern der Sache auf den Grund. Hinter HTML, CSS und dem Validator steckt nämlich weitaus mehr als eine Rechtschreibprüfung:
Der Sinn von CSS ist, die Optik vom Inhalt zu trennen. Erste Konsequenz daraus ist, daß <table> & Co. nicht mehr für das Design verwendet wird, sondern nur noch für tabellarische Daten. Ebenfalls sollte man mit <div> und besonders <span> nur sparsam umgehen, denn beide Elemente haben überhaupt keine inhaltliche Aussage (im Gegensatz zu beispielsweise <h1> und <strong>, die eine Hauptüberschrift respektive einen hervorgehobenen Text kennzeichnen). Immer fragwürdig in dieser Hinsicht, wenn auch nicht immer vermeidbar, ist der Einsatz von <div> an Stelle von <img>.
Und so schwer es manchen auch fällt: Mit HTML und CSS ist in dieser Philosophie vieles, aber nicht alles möglich. HTML wurde entworfen, um Texte unabhängig vom Anzeigegerät darstellen und untereinander verbinden zu können. Anzeigegerät können Unterschiede aufweisen, daher müssen Kompromisse gemacht werden. Akzeptiere dies.Dein Problem ist, daß der IE die Seite an einem anderen Punkt beginnt als Mozilla. Und Mozilla sicherlich an anderer Stelle als Opera, welcher wiederum ganz woanders anfängt als ein Mobiltelefon. Dementsprechend kannst Du nicht einfach pixelgenau eine Eckgrafik platzieren und erwarten, daß sie bei jedem Browser genau über der Tabellenecke sitzt.
Man kann es per CSS noch ändern, aber damit wird die Sache nur noch wackeliger.Um sämtliche Fehler auszubügeln, würde ich deshalb folgendes vorschlagen:
<body>
Compmess ist eine tolle Firma.
</body>(plus HTML-Gerüst drumherum versteht sich)
Wie Du siehst, fällt das komplette Tabellendurcheinander weg. Den Rahmen malst Du einmal als Grafik mit den Abmessungen 1600x1200, bei geringer Farbtiefe und Wahl eines vernünftigen Dateiformats (PNG, GIF, nicht Windows Bitmap) wird die Dateigröße dieser Grafik nicht allzu groß ausfallen. Diese Grafik bindest Du per CSS als Hintergrundgrafik von <body> ein, keine Wiederholung, eventuell etwas platzieren (http://www.w3.org/TR/REC-CSS2/colors.html#background-properties). Passe außerdem den Innenabstand an (padding).
Du erhältst auf diese Art und Weise fast das gleiche Aussehen wie mit Deinem Tabellenlayout; sorgst Du noch dafür, daß die Rahmen am rechten und unteren Ende der Grafik nett auslaufen, fällt das niemandem auf.
Überdeutlich zu erkennen sind die Vorteile der strikten Aufgabentrennung von HTML und CSS: Gleiches optisches Ergebnis, aber statt geschätzten zwanzig Zeilen nur drei. Entsprechend kleinere Datei, entsprechend schnellere Übertragung, entsprechend einfachere Wartung und, last but not least, der Inhalt ist auch noch auf dem simpelsten Textbrowser nutzbar.