zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Probleme im Internet Explorer

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 19.06.2013, 13:42
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 02.01.2007
Beiträge: 243
web334 befindet sich auf einem aufstrebenden Ast
Standard Probleme im Internet Explorer

Ich bin gerade dabei, eine Extra Internetseite für ein Turnier zu erstellen und bisher hat das Ganze auch ganz prima geklappt, aber im Internet Explorer 8 und 6 treten Probleme auf.
Mein bisheriger Entwurf ist hier zu finden:
next-cup

im Internet Explorer 8 ist das Logo total verzerrt. Die andere Grafik passt einwandfrei. Was stimmt denn da mit dem Logo nicht?

Screenshot Internet Explorer 8



und im Internet Explorer 6 funktioniert anscheinend gar nichts. Zumindest wird so gut wie gar nichts angezeigt. Viele von euch werden natürlich sagen, dass der Internet Explorer 6 doch von so gut wie keinem mehr verwendet wird, aber in unserer ländlichen Gegend ist das anscheinend immer noch der Fall und von daher möchte ich die Internetseite auf so haben, dass sie auch im Internet Explorer 6 korrekt angezeigt wird. Das müsste doch machbar sein. Ich habe ja nur ganz einfache Sachen verwendet, die auch im Internet Explorer 6 funktionieren müssten. So wie das ganze im Moment aussieht, ist das eine einzige Katastrophe und das muss ich mir bestimmt dann auch anhören.

Screenshot Internet Explorer 6



Es wäre jedenfalls sehr super, wenn ihr mir helfen würdet, die Probleme zu beheben.
im Internet Explorer 7 funktioniert die Seite übrigens ganz gut.
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 19.06.2013, 13:58
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

IE8: width:auto für das Bild.

IE6: Mit welcher Art IE6 ist der Screenshot entstanden? Mein IE6 zeigt die Inhalte zwar etwas zerwürfelt, aber er zeigt sie an.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 19.06.2013, 16:17
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 02.01.2007
Beiträge: 243
web334 befindet sich auf einem aufstrebenden Ast
Standard

Vielen Dank für deine Antwort!

Die Ergänzung für den Internet Explorer 8 habe ich vorgenommen und nun passt es.
Wieso wurde das Logo verzerrt und die andere Grafik nicht? Wenn Du weißt, wo ich mich weiter darüber informieren kann, dann teile mir dies bitte mit.

Die Screenshots wurden mit IE NetRenderer - Browser Compatibility Check - erstellt.
Ich kenne zwar das Programm My DebugBar | IETester / Browser Compatibility Check for Internet Explorer Versions from 5.5 to 10 , aber jedes Mal wenn ich damit in irgendeinem Browser eine Seite aufrufen möchte, dann stürzt dieses Programm ab.
Hast du noch einen Tipp, was ich denn für den Internet Explorer 6 noch ändern oder ergänzen muss, damit das Ganze auch dort funktioniert?
Mit Zitat antworten
  #4 (permalink)  
Alt 19.06.2013, 16:34
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Zitat:
Zitat von web334 Beitrag anzeigen
Die Ergänzung für den Internet Explorer 8 habe ich vorgenommen und nun passt es.
Wieso wurde das Logo verzerrt und die andere Grafik nicht? Wenn Du weißt, wo ich mich weiter darüber informieren kann, dann teile mir dies bitte mit.
Vermutlich, weil du ein Bild mit max-width:100% in einem Element hast, das wiederum shrink-to-fit-Breite hat. Ich habe keine Zeit, das weiter zu analysieren.
Da dieses Logo in dieser Konstallation ohnehin nicht responsiv reagiert, kannst du auch einfach eine width in Pixel für das Bild angeben und max-width auf none setzen.

width:auto sollte bei deinen allgemeinen Angaben für "responsive images" immer dazu.

Zitat:
Hast du noch einen Tipp, was ich denn für den Internet Explorer 6 noch ändern oder ergänzen muss, damit das Ganze auch dort funktioniert?
Gib eine feste Gesamtbreite an.
Gib eine Breite für das Element #logo an.
Blende alle diese Zusatzelemente aus, die alphatransparente Hintergründe enthalten.
Dann teste erneut.

Wenn du deine Seite für IE 6 "optimieren" willst, musst du in einem nativen IE6 testen -- alles andere hat keinen Sinn.
Microsoft bietet Virtuelle Maschinen an: Cross-browser testing simplified | Testing made easier in Internet Explorer | modern.IE

Geändert von fricca (19.06.2013 um 16:38 Uhr)
Mit Zitat antworten
  #5 (permalink)  
Alt 19.06.2013, 16:49
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 02.01.2007
Beiträge: 243
web334 befindet sich auf einem aufstrebenden Ast
Standard

Danke für die Infos! Werde nun versuchen, diese umzusetzen
Mit Zitat antworten
  #6 (permalink)  
Alt 19.06.2013, 18:24
Benutzerbild von Manfred62
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2009
Ort: Ludwigsburg
Beiträge: 2.134
Manfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nett
Standard

bei mir sieht es im IE6 auch halbwegs aus (etwas durcheinander, aber fast alles da).

wegen IE6: ich habe dazu einen portablen IE6. Läuft auf XP und 7, unabhängig vom installierten IE.
Link: https://www.box.com/shared/9ohzn4tb38
Mit Zitat antworten
  #7 (permalink)  
Alt 20.06.2013, 09:24
Benutzerbild von protonenbeschleuniger
Verbesserer
XHTMLforum-Kenner
 
Registriert seit: 06.09.2007
Beiträge: 4.977
protonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von web334 Beitrag anzeigen
Mein bisheriger Entwurf ist hier zu finden:
next-cup
Noch ein allgemeiner Tipp: Du hast einen Fehler im CSS, der in der Fehlerkonsole (als Warnung) angezeigt wird.

Dann sieht es so aus, als ob das Doklument eine BOM enthält (sagt der Validator) das führt dazu, dass der IE 6 im Quirksmodus darstellt.

Und mit dem clearfix wird der wohl nicht zurecht kommen, wenn du wirklich den IE 6 unterstützen musst, würde ich da eine andere Methode verwenden.
Mit Zitat antworten
  #8 (permalink)  
Alt 20.06.2013, 14:51
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 02.01.2007
Beiträge: 243
web334 befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von Manfred62 Beitrag anzeigen
bei mir sieht es im IE6 auch halbwegs aus (etwas durcheinander, aber fast alles da).

wegen IE6: ich habe dazu einen portablen IE6. Läuft auf XP und 7, unabhängig vom installierten IE.
Link: https://www.box.com/shared/9ohzn4tb38
Danke für diesen portablen IE6 !!! Ist wirklich praktisch.

Leider sieht meine Seite trotz zahlreicher Änderungen noch immer katastrophal aus. Also im IE6. Total durcheinander.


Zitat:
Zitat von protonenbeschleuniger Beitrag anzeigen
Noch ein allgemeiner Tipp: Du hast einen Fehler im CSS, der in der Fehlerkonsole (als Warnung) angezeigt wird.
danke für den Tipp. Eigentlich achte ich immer ganz genau darauf, dass die CSS keine Fehler enthält, aber einen habe ich wohl übersehen.
Gewusst habe ich zwar auch, dass *zoom:1; ein Fehler ist, aber ich habe gedacht, dass das in Ordnung ist, denn ich habe auf mehreren Seiten gelesen, dass man bei clearfix auch folgendes angeben soll
Code:
.clearfix {*zoom: 1;}
Zitat:
Zitat von protonenbeschleuniger Beitrag anzeigen
Dann sieht es so aus, als ob das Doklument eine BOM enthält (sagt der Validator) das führt dazu, dass der IE 6 im Quirksmodus darstellt.
BOM habe ich nun auch entfernt.

Zitat:
Zitat von protonenbeschleuniger Beitrag anzeigen
Und mit dem clearfix wird der wohl nicht zurecht kommen, wenn du wirklich den IE 6 unterstützen musst, würde ich da eine andere Methode verwenden.
mittlerweile habe ich mehrere Varianten für clearfix ausprobiert, aber der IE6 zeigt die Seite immer noch nicht korrekt an.
Was soll man denn für clearfix nun am besten nehmen?


Variante 1:
Code:
.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  font-size: 0; 
  height: 0;
  visibility: hidden;
}
 
/* IE-Patch für IE 7*/
*:first-child+html .clearfix { min-height: 0; } 
	
/* IE-Patch für IE 6*/
* html .clearfix { height: 1%; }
	
oder so für den Internet Explorer 7 und 6
<!--[if lte IE 7]>
<style type="text/css">
  .clearfix { height: 1%; }   /* oder { zoom: 1; } */
</style>
<![endif]-->

Variante 2:
Code:
.clearfix:before, .clearfix:after {
	content: " ";
	display: table;
}
.clearfix:after {
	clear: both;
}
.clearfix {
	*zoom: 1;
}

oder Variante 3:
Code:
.clearfix:before, .clearfix:after {
	content: " ";
	display: table;
}
.clearfix:after {
	clear: both;
}
.clearfix {
	*zoom: 1;
}


Und Das folgende für Internet Explorer 7 & 6

.clearfix:after {
   clear: both;
   content: " ";
   display: block;
   font-size: 0;
   height: 0;
   visibility: hidden;
}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

hier noch einmal der Link zur Seite:
next-cup
Mit Zitat antworten
  #9 (permalink)  
Alt 20.06.2013, 15:07
Benutzerbild von Manfred62
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2009
Ort: Ludwigsburg
Beiträge: 2.134
Manfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nett
Standard

clearfix: Variante 2 (von Nicolas Gallagher) sollte eigentlich gehen. Das *zoom:1 ist für IE6/7 gedacht.
Das *zoom:1 ist natürlich nicht valide. Könnte man aber per cc in ein extra stylesheet packen. Vermutlich musst du für den IE6 wirklich etliches extra machen.
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 20.06.2013, 15:22
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 02.01.2007
Beiträge: 243
web334 befindet sich auf einem aufstrebenden Ast
Standard

Danke für deine Antwort.
Ich werde dann also *zoom:1; nur in einer extra CSS für den IE6 und auch für den IE7 aufführen.
Wenn ich diesen Code also in eine extra CSS für diese beiden packe, benötige ich dann auch den * oder kann ich auf diesen verzichten?

Dann werde ich mich mal daran versuchen, das Ganze so umzubauen, dass es auch im Internet Explorer 6 funktioniert oder das ist zumindest deutlich besser funktioniert als bisher.
In den anderen Browsern wird die Seite nach meiner bisherigen Erfahrung korrekt dargestellt oder gibt es einen Browser, in dem es nicht passt?
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Probleme mit dem Internet Explorer Webby0815 CSS 8 24.02.2011 16:36
Probleme mit gefloatete Bereich im Internet Explorer gustavmega CSS 2 20.08.2009 01:28
Probleme mit Internet Explorer Darstellung loadzone CSS 2 20.04.2008 22:24
position probleme mit dem internet explorer alejandro CSS 6 11.02.2008 15:54
Conflict between Mime Type and Document Type: Probleme im Internet Explorer Jipii (X)HTML 4 22.01.2008 20:49


Alle Zeitangaben in WEZ +2. Es ist jetzt 14:36 Uhr.