Probleme mit XHTML und InternetExplorer
Jens Schärer
- html
0 Cheatah0 Jens Schärer0 Cheatah0 Jens Schärer0 molily
0 Jens Schärer
0 Marc0 Jens Schärer0 at
Hallo!
Ich habe ein Problem mit dem Internet Explorer (mal wieder :grmpf:)... naja, scheinbar versteht der Browser kein gescheites XHTML, obwohl die Seite durch den XHTML-Validator und den CSS-Validator gelaufen ist und sowohl in Opera als auch in Firefox richtig angezeigt wird...
Die Problemstelle:
<div id="contentbox" onmouseover="hideLastMenu();" align="center">
<img src="images/testbild.jpg" width="640" height="480" alt="Sonnenaufgang" border="0"/>
<div id="navigationbox">
<p class="text" style="text-align: center;">« zurück | vorwärts »</p>
</div>
</div>
Betroffener CSS-Code:
#contentbox
{
position: absolute;
top: 280px;
left: 260px;
padding: 5px;
border-style: solid;
border-width: 1px;
border-color: #B5D3E1;
background-image: url(../images/textbox_background.jpg);
width: 640px;
z-index: 3;
}
#navigationbox
{
position: absolute;
bottom: -20px;
left: -1px;
padding: 0px;
border-style: solid;
border-width: 1px;
border-color: #B5D3E1;
background-color: #F2F7FA;
width: 100%;
z-index: 3;
}
Die Seite findet ihr unter http://jens.gamechexx.net/jswb/ (Jaja, der Inhalt fehlt noch ;))
Im InternetExplorer wird unten die Navigationsleiste am Ende ein Stück abgeschnitten. Warum? Wie kann ich das beheben?
Danke schonmal :)
Hi,
Im InternetExplorer wird unten die Navigationsleiste am Ende ein Stück abgeschnitten. Warum? Wie kann ich das beheben?
ohne es genau untersucht zu haben: Sieht wie der Box-Model-Bug aus. Du hast den IE in den Quirks-Mode gezwungen, indem Du - tadaa! - einen <?xml?>-Prolog geschrieben hast. Der IE erwartet den DOCTYPE als _erstes_ im Code. Traurig, peinlich, aber typisch.
Cheatah
ohne es genau untersucht zu haben: Sieht wie der Box-Model-Bug aus. Du hast den IE in den Quirks-Mode gezwungen, indem Du - tadaa! - einen <?xml?>-Prolog geschrieben hast. Der IE erwartet den DOCTYPE als _erstes_ im Code. Traurig, peinlich, aber typisch.
Hab das entsprechend abgeändert, hat aber, bis auf ein oder zwei Pixel, nix verändert :(
Sonst noch irgendwelche Tipps?
Hi,
Hab das entsprechend abgeändert, hat aber, bis auf ein oder zwei Pixel, nix verändert :(
bei meinem IE 6 stimmen die Ergebnisse mit modernen Browsern jetzt überein. Für ältere IEs musst Du leider CSS-Hacks anwenden, um "korrigierte" Werte zu vermitteln, z.B. den Tantek-Hack.
Cheatah
Hi,
Hallo,
bei meinem IE 6 stimmen die Ergebnisse mit modernen Browsern jetzt überein. Für ältere IEs musst Du leider CSS-Hacks anwenden, um "korrigierte" Werte zu vermitteln, z.B. den Tantek-Hack.
Für ältere Browser will ich die Seite nicht mehr bereit stellen, da diese nur ansatzweise richtiges XHTML zur Verfügung stellen.
Gruß,
Jens
Hallo,
bei meinem IE 6 stimmen die Ergebnisse mit modernen Browsern jetzt überein. Für ältere IEs musst Du leider CSS-Hacks anwenden, um "korrigierte" Werte zu vermitteln, z.B. den Tantek-Hack.
Für ältere Browser will ich die Seite nicht mehr bereit stellen, da diese nur ansatzweise richtiges XHTML zur Verfügung stellen.
Wie bitte? Falls du sagen willst, dass diese älteren IEs XHTML nicht verstehen: Du lieferst dein XHTML sowieso als text/html aus, daher ist es, wie es so schön heißt, schnurzpiepegal, ob der Browser XHTML kann oder nicht. Die besagten älteren MSIE 5.x-Browser können genauso viel XHTML (als text/html) wie MSIE 6. Das gilt auch prinzipiell für Browser der sogenannten 4. Generation.
Mathias
Du lieferst dein XHTML sowieso als text/html aus, daher ist es, wie es so schön heißt, schnurzpiepegal, ob der Browser XHTML kann oder nicht. Die besagten älteren MSIE 5.x-Browser können genauso viel XHTML (als text/html) wie MSIE 6. Das gilt auch prinzipiell für Browser der sogenannten 4. Generation.
Mathias
Browser der 4. Generation können aber längst nicht mit allen CSS-Formatoptionen umgehen und diese darstellen, was eine wesentliche Anforderung des XHTML-Standards ist (Trennung zwischen Darstellung und Daten -> CSS und HTML). Und eben Browser der 4. Generation verstehen auch den entsprechenden HTML-Code nicht, wenn sie nicht auch die Stylesheets lesen können. Wenn der div-Tag nicht richtig verarbeitet wird, weil das Stylesheet nicht zugewiesen wird und alles untereinander und nicht wie angegeben an den richtigen Positionen dargestellt wird nützt mir auch der beste HTML-Code nix ;)
Hi,
Browser der 4. Generation können aber längst nicht mit allen CSS-Formatoptionen umgehen und diese darstellen, was eine wesentliche Anforderung des XHTML-Standards ist (Trennung zwischen Darstellung und Daten -> CSS und HTML).
Wieso? Die wichtigsten CSS(1)-Formatierungen können sie schon. Welche HTML-Attribute wären es denn, die in XHTML nicht mehr zulässig sind und deren CSS-Äquivalente nicht umgesetzt werden können?
freundliche Grüße
Ingo
Hat sich erledigt :)
Moin moin
Betroffener CSS-Code:
#contentbox
{
position: absolute;
top: 280px;
left: 260px;
padding: 5px;
border-style: solid;
border-width: 1px;
border-color: #B5D3E1;
background-image: url(../images/textbox_background.jpg);
width: 640px;
z-index: 3;
}#navigationbox
{
position: absolute;
bottom: -20px;
left: -1px;
padding: 0px;
border-style: solid;
border-width: 1px;
border-color: #B5D3E1;
background-color: #F2F7FA;
width: 100%;
z-index: 3;
}Die Seite findet ihr unter http://jens.gamechexx.net/jswb/ (Jaja, der Inhalt fehlt noch ;))
Im InternetExplorer wird unten die Navigationsleiste am Ende ein Stück abgeschnitten. Warum? Wie kann ich das beheben?
Das Problem ist wohl "padding:5px;" - das addiert der IE zur Boxbreite und daher ist nicht die untere Box abgeschnitten, sondern die umgebende Box erscheint dem IE als 100% plus 5px links und 5px rechts, also 10px... diese 10 px scheinen der unteren Box zu fehlen - in Wirklichkeit ist aber die untere Box korrekt und die obere zu breit.
Füge unten noch padding-left:5px; und padding-right:5px; hinzu - dann sollte es klappen...
Danke schonmal :)
Bedanke dich erst, wenn es geklappt hat :-)
Gruß,
Marc.
Füge unten noch padding-left:5px; und padding-right:5px; hinzu - dann sollte es klappen...
Hallo,
Habs jetzt so probiert, hat anfangs nicht funktioniert, weil die 100% entweder vom einen oder vom anderen Browser falsch interpretiert werden ;) Hab jetzt aus den 100% 640px gemacht, jetzt passts :)
Danke, Jens
Hallo.
Habs jetzt so probiert, hat anfangs nicht funktioniert, weil die 100% entweder vom einen oder vom anderen Browser falsch interpretiert werden ;) Hab jetzt aus den 100% 640px gemacht, jetzt passts :)
Kennst du http://de.wikipedia.org/wiki/Pyrrhussieg?
MfG, at