Verschobene Anzeige in IE 6 und firefox

[Patrick Andrieu]

Hallo anja!

fixe höhe geb ich aber einfach zB mit height:300px an, oder? und dann noch overflow:auto bei denjenigem div dazu....!?

Grrr.... Du hast immer noch diese Tabelle drin! Abgesehen davon ist das Attribut »height« im <table>-Tag nicht erlaubt. Wenn Du, vielleicht für die Preisliste, Tabellen einsetzt, dann solltest Du die Höhe mittels entsprechender CSS-Regel definieren.

Jetzt schau mal, was ich mit fester Höhe meinte. Ich habe in meinem Beispiel mehr Text innerhalb vom DIV »Inhalt« hinzugefügt. Es erscheint eine Scrollleiste (gestern war da noch keiner, gell? Da war auch weniger Text). _Das_ meinte ich mit fester Höhe (für das DIV) und overflow:auto:

http://www.atomic-eggs.com/z_testdir/studio_grau.htm
validiert jetzt, weil ich die fehlenden alt-Attribute in den img-Tags hinzugefügt habe. Ferner habe ich den img-Tags noch ein title-Attribut ohne Wert (title="") verpasst, weil sonst die IEs alt (fälschlicherweise) als Tooltip anzeigen.

Warum kopierst Du Dir das Beispiel nicht und probierst damit herum? Auf Deiner Studio-Seite sind noch so viele Unstimmigkeiten und Fehler:

http://www.hotel-hubertus.at/tanja_neu/seiten/strich_grau/studio_grau.htm
http://validator.w3.org/check?uri=http%3A//www.hotel-hubertus.at/tanja_neu/seiten/strich_grau/studio_grau.htm

Beispiel aus Deinem Quelltext:

  
<p id="Fusszeile">  
  <div align="left">  
  
<ul>  
<li>  
<a href="studio_grau.htm"><img src="links/studio.gif" width="70" height="70" border="0" alt="studio"></a>  
<a href="nageldesign_grau.htm"><img src="links/nageldesign.gif" width="70" height="70" border="0" alt="nageldesign"></a>  
<a href="preisliste/preisliste_grau.htm"><img src="links/preis_liste.gif" width="70" height="70" border="0" alt="preisliste"></a>  
<a href="angebote.htm"><img src="links/angebote.gif" width="70" height="70" border="0" alt="angebote"></a>  
<a href="uebermich_grau.htm"><img src="links/ueber_mich.gif" width="70" height="70" border="0" alt="uebermich"></a>  
<a href="g&#228;stebuch/gaestebuch.htm" target="_parent"><img src="links/gaestebuch.gif" width="70" height="70" border="0" alt="gaestebuch"></a>  
<a href="kontakt_grau.htm"><img src="links/kontakt.gif" width="70" height="70" border="0" alt="kontakt"></a>  
</li>  
</ul>  
  
  </div>  
  
</p>  

Warum das p-Element hier? Ein div-Element darf nicht innerhalb eines p stehen, aus diesem Grund moniert der Validator: »Line 172, Column 3: end tag for element "P" which is not open.«.

Das p gehört weg, das div bekommt die ID »Fusszeile« und kein align="left", weil es im CSS (s. mein Beispiel) bereits links gefloated wird.

Nach _jeder_ Änderung solltest Du Dir die Seite zunächst in jedem Browser, die Du hast (Opera, FF, IE 6/7) anschauen (zum Beispiel ist bei Deiner studio_grau-Seite die Blümchennavi ganz oben unterm Banner) UND den Validator aufrufen! Er zeigt Dir sofort, was Du falsch gemacht hast.

Wenn Du beide Seiten vergleichst, schau Dir zunächst das HTML an und vergleiche, was anders ist. Dann schau Dir das CSS an und vergleiche auch.

Viele Grüße aus Frankfurt/Main,
Patrick