✔ Verzerrung von Tabellen im IE bzw. CSS-Datei

[Nadira]

Ich brauch jetzt jemanden mit Ahnung. Und ich hoffe ihn genau hier zu finden.
Denn in meinem neuen Lay gibt es ein gewaltiges Problem, das nur im IE auftritt. Ich finde den Fehler nicht. Habe auch schon einige Bekannte drauf angesetzt und komme dennoch nicht weiter.

http://www.seelenbeben.com/test/index1.html

Die Tabelle wird in der Mitte völlig auseinander geschoben, ich habe nicht den Schimmer einer Ahnung aus welchem Grund dies passiert. Stehe sozusagen auf dem Schlauch. Es verwirrt mich allein schon, dass der obere/mittlere Grafikbereich so weit oben angesetzt wird. Es muss wohl am Iframe liegen oder? Denn unterhalb des Iframes wird noch ein Bild (weiß/ nur mit Markierung erkennbar) verzogen.
Firefox stellt keinerlei Probleme dar.

Desweiteren wird meine style.css Datei nicht gelesen- kennt wer den Grund? Allein komm ich nicht weiter...

Love Nadira

 

[Maik]

Im HTML-Quelltext und der CSS-Datei steckt nicht nur ein Fehler, der für die Probleme sorgt:

• Result for http://www.seelenbeben.com/test/index1.html - W3C Markup Validator
  
  
• Das rotmarkierte hat in der CSS-Datei nichts zu suchen:

<style type="text/css">
<!--

/* Achtung: Hier fehlt der body-Selektor! */
{scrollbar-arrow-color: #F5F3F4;
scrollbar-track-color: #FFFFFF;
scrollbar-face-color: #FFFFFF;
scrollbar-highlight-color: #F5F3F4;
scrollbar-3dlight-color: #FFFFFF;
scrollbar-darkshadow-color: #FFFFFF;
scrollbar-shadow-color: #F5F3F4;

font-size: 11pX; color: #ffffff; font-family: Courier, Verdana, Tahoma; letter-spacing: 0pt; cursor: crosshair;}

...

</style>

Anmerkung: eine weiße Schrift auf weißem Seitenhintergrund macht sich nicht gut, gleiches gilt für die Scrollbalken-Formatierung im IE.

• Der Grund für die Layoutverschiebungen im IE sind die Leerzeichen bzw. Zeilenumbrüche zwischen <td> <img src=""> </td>:
  

<TD>
         <IMG SRC="images/back_01.jpg" WIDTH=175 HEIGHT=757 ALT="">
</TD>

Lösung: notiere folgende CSS-Regel für die Grafiken:

img {display: block; }

oder entferne die sog. Whitespaces im Quelltext:

<TD><IMG SRC="images/back_01.jpg" WIDTH=175 HEIGHT=757 ALT=""></TD>

 

[Nadira]

Die css Datei weigert sich noch immer hartnäckig.
Die Designeinstellungen sind nicht auf die Website angepasst. Aber ich kämpfe im Moment auch nur darum, dass die Datei erkennbar wird und alles klappt. Dann kommt der Feinschliff.

Die Images werden jetzt aber korrekt angezeigt. Danke...

 

[Maik]

In der CSS-Datei fehlt ja auch noch immer der body-Selektor. Zudem hast du die empfohlene CSS-Regel für die Grafiken innerhalb der body-Formatierungen notiert.

Hier der fehlerbereinigte Abschnitt der CSS-Datei:

body {
scrollbar-arrow-color: #F5F3F4;
scrollbar-track-color: #FFFFFF;
scrollbar-face-color: #FFFFFF;
scrollbar-highlight-color: #F5F3F4;
scrollbar-3dlight-color: #FFFFFF;
scrollbar-darkshadow-color: #FFFFFF;
scrollbar-shadow-color: #F5F3F4;
font-size: 11px;
color: #000; /* temporär auf schwarz gestellt, damit der Text zu lesen ist */
font-family: Courier, Verdana, Tahoma;
letter-spacing: 0pt;
cursor: crosshair;
}

img { display: block; }