Probleme unter IE (allen versionen)

[MatthiasB]

Hallo,
Wie das Thema schon sagt habe ich Probleme mit einer Website die nur unter Internet Explorer auftreten.

Unter allen IE:
-die mit jQuery erzeugten Fade Effekte der Bilder funktioniert nur bei den Bildern oben links und unten rechts. Die anderen wechseln ohne Effekt.
-Die Bilder rechts unten zeigen beim wechseln mit fade Effekt nur einen Ausschnitt des Bildes

Unter IE 7 und niedriger:
-ein ungewollter Rand auf der rechten Seite
-Das Suchformular lässt sich kaum noch anwählen (als ob es verdeckt währe)
-Footer rutscht scheinbar in den body (contentbereich)

Unter IE 8:
-Der komplette Container ist nach unten verschoben.

Die Seite:
http://vingado.eu/impressum/test/

Ich habe das ganze unter Firefox entwickelt, da geht alles, auch unter Chrome.
Habe auch schon einige Änderungen für den IE eingebaut, da zu Beginn alles nach rechts außen verlagert war.
Code seht ihr ja auf der Seite, wenn noch was von Nöten sein sollte liefer ich gerne nach ;)

mfg
Matthias

[JürgenB]

Hallo MatthiasB,

bring mal das html in Ordnung, dann kann man weiter sehen:

http://validator.w3.org/check?uri=http://vingado.eu/impressum/test/

Gruß, Jürgen

[MatthiasB]

Hallo Jürgen,

Ich war bereits schon einmal auf der Seite habe es dann aber erst einmal zur Seite geschoben als ich gemerkt habe das die Meldungen zu mindestens 90% so nicht existieren.
Diverse tags die angeblich nicht offen sind oder nicht geschlossen wurden usw.
Dabei SIND sie geschlossen/offen.
Das meiste ist sogar automatisch generierter Code von Wordpress...

Nun ja, ich werde mich damit beschäftigen wen ich die Kompatibilitätsprobleme gelöst habe. Mag vielleicht nicht der beste Programmierstyle sein aber so bin ich halt^^

Trotzdem danke für den Hinweis, hatte es schon fast wieder vergessen, dass ich da nochmal vorbeischauen wollte.

[ChrisB]

Hi,

Ich war bereits schon einmal auf der Seite habe es dann aber erst einmal zur Seite geschoben als ich gemerkt habe das die Meldungen zu mindestens 90% so nicht existieren.

Dass die Meldungen existieren, siehst du doch :-)

Du meinst vermutlich, dass die Fehler keine wären?
Doch, das sind sie.

Diverse tags die angeblich nicht offen sind oder nicht geschlossen wurden usw.
Dabei SIND sie geschlossen/offen.

Oftmals ist falsche Verschachtelung von Elementen an solchen Meldungen schuld.

Das meiste ist sogar automatisch generierter Code von Wordpress...

Ja und?

Nun ja, ich werde mich damit beschäftigen wen ich die Kompatibilitätsprobleme gelöst habe.

Nein, das solltest du unbedingt vorher machen.
Nur wenn dein Code fehlerfrei ist, kannst du auch vorhersehbare Ergebnisse erwarten.

Und es besteht eine hohe Wahrscheinlichkeit, dass die vermeintlichen "Kompabilitätsprobleme" durch die Fehler in deinem Code überhaupt erst ausgelöst werden.

Mag vielleicht nicht der beste Programmierstyle sein aber so bin ich halt^^

Damit schaffst du dir nur Mehrarbeit.

MfG ChrisB

[MatthiasB]

Also:

Was ich damit meinte wen es von Wordprss automatisch generierter Code ist:
-Zum Teil sagen die Fehlermeldungen das in einem, per WYSIWYG Editor von Wordpress, erstellten Artikel fehlerhaften Code enthalten ist.

• Oder das in den Links die das Presse Plugin von Google bekommt Fehler sind.

Ich werde mir das Ganze noch mal genau anschauen.  ;)
Morgen melde ich mich dann nochmal, wenn in der Zwischenzeit jemandem vielleicht gängige Fehler einfallen im Zusammenhang mit oben genannten Problemen mit dem IE bin ich ihm natürlich dankbar.

Mfg
Matthias

[EKKi]

Mahlzeit MatthiasB,

Wie das Thema schon sagt habe ich Probleme mit einer Website die nur unter Internet Explorer auftreten.

Das ist bei 104 Errors, 9 warning(s) schon fast ein Wunder.

Ich habe das ganze unter Firefox entwickelt, da geht alles, auch unter Chrome.

Ein Hoch auf deren Fehler-"Korrektur" ...

Code seht ihr ja auf der Seite, wenn noch was von Nöten sein sollte liefer ich gerne nach ;)

Ja, sauberer und valider Code wäre vonnöten. Das sollte eigentlich eine Selbstverständlichkeit sein, bevor Du Dich an irgendwelche Verschlimmbesserungen für IrgendEinen Browser machst ...

MfG,
EKKi

[MatthiasB]

Hallo,
Die eigentlichen Probleme sind gestern leider untergegangen. Nachdem ich nun gestern Abend alle Fehlermeldungen durchgegangen bin die mir gezeigt wurden, hat sich an meinem Problem nichts geändert. Allgemein hat sich nichts geändert^^.

Hier nochmal meine Probleme:

Unter allen IE:
-die mit jQuery erzeugten Fade Effekte der Bilder funktioniert nur bei den Bildern oben links und unten rechts. Die anderen wechseln ohne Effekt.
-Die Bilder rechts unten zeigen beim wechseln mit fade Effekt nur einen Ausschnitt des Bildes

Unter IE 7 und niedriger:
-ein ungewollter Rand auf der rechten Seite
-Das Suchformular lässt sich kaum noch anwählen (als ob es verdeckt währe)
-Footer rutscht scheinbar in den body (contentbereich)

Unter IE 8:
-Der komplette Container ist nach unten verschoben.

Ich benutze das jQuery Plugin innerfade.

Hier ein Ausschnitt aus der relevanten CSS Datei:

  
#limiter {  
       width: 650px;  
       height: 500px;  
       overflow: hidden;  
       position: relative;  
       left: 50%;  
       margin-left: -320px;  
}  
  
#wrapperIE {                /* Nur für Internet Explorer*/  
       position: relative;  
       left: 50%;  
       width: 650px;  
       padding-top : 0px;  
       margin-bottom: -25px;  
       padding-bottom: 45px;  
}  
#limiterIE {                /* Nur für Internet Explorer*/  
       overflow: hidden;  
       width: 650px;  
       margin-left: -555px;  
}  
  
ul {  
        list-style:none;  
}  
  
  
/* Listen */  
ul#lefttop li img{  
        display: block;  
        position: relative;  
        margin-top: 5px;  
        margin-bottom: 5px;  
        margin-left: 5px;  
}  
ul#righttop li img{  
        position: relative;  
        display: block;  
        margin-left: 405px;  
        margin-top: -232px;  
}  
  
... Für jede Liste...  
  
ul#middlebottom li img{  
        position: relative;  
        display: block;  
        margin-top: -964px;  
        margin-left: 210px;  
}  
ul#pay li img{  
       display: block;  
       position: relative;  
        left: 200px;  
        margin-top: -1375px;  
}  
...  
}  

Und hier der Aufruf:
Ich habe bereits etwas experimentier mit den Conditional Comments, dadurch konnte ich den Container immerhin mal zentrieren ^^, aber wirklich weiter komme ich nicht.

  
<!--[if lte IE 7]>  
<div id="wrapperIE">  
<![endif]-->  
  
<!--[if lte IE 7]>  
<div id="limiterIE">  
<![endif]-->  
  
<div id="limiter">  
        <ul id="lefttop">  
                <?PHP  
                include("inc.imagesklein.php");  
                ?>  
        </ul>  
  
         ....Für alle Listen...  
  
<!--[if lte IE 7]>  
</div>  
<![endif]-->  
</div>  

p.s.: Entschuldigt den Doppel Post(Verschiedene Darstellungsfehler unter allen IE Versionen), kann gelöscht werden.

[Struppi]

Hallo,
Die eigentlichen Probleme sind gestern leider untergegangen. Nachdem ich nun gestern Abend alle Fehlermeldungen durchgegangen bin die mir gezeigt wurden, hat sich an meinem Problem nichts geändert. Allgemein hat sich nichts geändert^^.

Du hast die Meldung in der Fehlerkonsole gesehen?

Und die wilden Verschachtelungen von inline und blockelementene wird wohl ihr übriges tun, dass es zu Problemen kommt.

Struppi.

[MatthiasB]

Du hast die Meldung in der Fehlerkonsole gesehen?

Ich bin mir jetzt nicht Sicher welche Meldung in welcher Konsole du meinst, aber da ich eben noch am Code rumexperimentiert habe, ist es durchaus möglich das der Fehler deswegen auftrat. Bitte sag bescheid wen es immernoch der Fall sein sollte.
(wen du die Meldungen von validator.w3.org meinst, über die weis ich bescheid ;) )

Und die wilden Verschachtelungen von inline und blockelementene wird wohl ihr übriges tun, dass es zu Problemen kommt.

Könntest du mir das etwas genauer erklären? Das ist das erste mal das ich eine Website erstelle, daher verstehe ich gerade nicht so ganz was du meinst^^

[Vinzenz Mai]

Hallo,

Ich bin mir jetzt nicht Sicher welche Meldung in welcher Konsole du meinst, aber da ich eben noch am Code rumexperimentiert habe, ist es durchaus möglich das der Fehler deswegen auftrat. Bitte sag bescheid wen es immernoch der Fall sein sollte.

wo ist das Problem, in Firefox auf die Fehlerkonsole zu klicken, die Meldung zu finden, auf die Meldung zu klicken und zu lesen:

ul.sf-menu li li.sfHover ul {
left: 10m; /* match ul width */
top: 1.7em;
}

Meter ist nun mal keine erlaubte Einheit für Längenangaben in CSS.

Dann gibt's noch in regelmäßigen Abständen die Meldung:

<zitat>
    "Fehler beim Verarbeiten des Wertes für 'opacity'. Deklaration ignoriert.
</zitat>

Wunderst Du Dich wirklich über fehlende Effekte?

(wen du die Meldungen von validator.w3.org meinst, über die weis ich bescheid ;) )

und die verflixt relevant sind. Du bevorzugst es, diese zu ignorieren, solches Verhalten bezeichnet man mit einem davon abgeleiteten Substantiv.

Und die wilden Verschachtelungen von inline und blockelementene wird wohl ihr übriges tun, dass es zu Problemen kommt.

Könntest du mir das etwas genauer erklären? Das ist das erste mal das ich eine Website erstelle, daher verstehe ich gerade nicht so ganz was du meinst^^

Beseitige *alle* Fehler, die Dir der Validator liefert. Kümmere Dich *anschließend* um die Darstellungsprobleme.

http://de.selfhtml.org/html/referenz/elemente.htm@title=SELFHTML kann.

Freundliche Grüße

Vinzenz

[ChrisB]

Hi,

(wen du die Meldungen von validator.w3.org meinst, über die weis ich bescheid ;) )

Dann *beseitige* sie auch endlich.

MfG ChrisB