XHTML Browser Bug-Report

[womstar]

Hallo Gemeinde,

in diesem Topic könnt Ihr von Bugs berichten, die euch so beim Cross-Browser Coden von XHTML-Seiten aufgefallen sind, um somit anderen Nutzern des Forums zu helfen, wenn diese das selbe Problem haben.

Dann mach ich mal den Anfang.


Netscape 6.0 & Doctypes

Wenn man Netscape 6.0 ein Dokument vorsetzt, welches mit einem Doctype bestückt ist, verhält er sich auf einmal ganz anders in bezug auf Werteübergaben per URL, die mit &-zeichen gesetzt sind.

Eine "URL" wie diese:
index.php?main=1&sub=2&subsub=1

Interpretiert Netscape 6.0 bei Klick auf die "URL" nur so:
index.php?main=1

Bei meinen Tests war Netscape 6.0 der einzige der diesen Fehler auf weiste.
Abhilfe schaft hier das &-Zeichen als HTML-Zeichencode zu setzen.

index.php?main=1&sub=2&subsub=1

So interpretiert auch Netscape 6.0 die Link richtig.


Grüße Robert

 

[RoyalKnight]

Bei meinen Tests war Netscape 6.0 der einzige der diesen Fehler auf weiste.
Abhilfe schaft hier das &-Zeichen als HTML-Zeichencode zu setzen.

Das schafft nicht nur Abhilfe, sondern hat auch noch den netten Nebeneffekt, dass der Code plötzlich valid wird Das ist also kein Bug, sondern Unkenntnis von XHTML. Das "normale" & ist nicht mehr erlaubt, sondern wird nur noch als Beginn einer Entity (bspw. & ¤...) verwendet. Also Netscape interpretiert den Quelltext richtig!

PS: Der Thread sollte wohl umbenannt werden zu "Häufige Fehler" bspw

 

[womstar]

& ist standard, dass ist richtig.
nur macht halt kein browser ob alt oder neu solche macken wieder ns6.0, sogar der ns7.0 kommt mit nur einem & klar.

 

[dkdenz]

CSS-Browser-Bug

Schreibt man in eine CSS folgendes:

body { overflow:auto; }

zeigen der Opera 7.23 und der Netscape 7.0 keinerlei Inhalt an.

Mozilla 1.8a1, K-Meleon 0.9, IE 6.0, FireFox 1.0 dagegen schon...

 

[ZeitGeist]

passt nicht ganz ins forum, weil eher html allgemein, aber da gabs keine Bugliste.

Fügt man in eine Tabellenzelle ein Blockelement (oder Bild) ein, stellt der IE Leerzeichen und -zeilen innerhalb der Zelle mit da.
sprich dieses hier:

<table>
  <tr>
    <td>
      <img.../>
    </td>
  </tr>
</table>

führt zu einer anderen Anzeige als dieses hier:

<table>
  <tr>
    <td><img.../></td>
  </tr>
</table>

 

[dms]

Abhilfe schafft folgendes:

<table>
  <tr>
    <td style="line-height:0;font-size:0"><!--[if IE]>.<![endif]-->
      <img.../>
    </td>
  </tr>
</table>

Direkt bei Tabellenzellen hab ich's ehrlich gesagt nicht getestet. Funktioniert auf jeden Fall aber bei verschachtelten <ul>'s
So ist's mir lieber als tausend verschachtelte Tags in eine Zeile zu klatschen.

Das Problem tritt glaube ich auch nur bei einem XHTML-Doctype auf.

 

[Grinsemann]

Das selbe wird auch durch die Zuweisung von Block-Element-Charakteristika erreicht:

<table>
  <tr>
    <td>
        <img style="display:block" … />
    </td>
  </tr>
</table>

Übrigens kann der Internet Explorer noch gar kein XHTML interpretieren.

 

[Harry Hunt]

Ich weiß nicht, ob das hier rein gehört, aber...
wenn bei der Verwendung von float:left/right in Kombination mit Hintergrundbildern diese im IE nur zum Teil oder erst nach einem Reload dargestellt werden, hilft es in der Regel, das betroffenen Element auf "position:relative" zu setzen.

 

[dkdenz]

Folgendes Szenario:
Nimmt man eine Liste zur Darstellung einer Navigation (vertikal) und setzt in der Liste (z.B. ul)
die darin enthaltenen Links auf text-align:right,
formatiert die Links (a-Tag) mit display:block,
zeigen alle richtigen Browser das korrekt an,
nämlich das die Links rechts ausgerichtet sind.
Nur der IE (wen wundert das inzwischen noch wirklich)
will in der Formatierung der a-Tags noch ein margin:0px auto haben,
ansonsten klappt das nicht.
(das kostete mich einige Zeit, dass herauszufinden)

ul {
list-style-type:none;
list-style-position:inside;
[B]text-align:right;[/B][I]/*das würde eigentlich schon reichen*/[/I]
display:inline;
}
a.menu:link, a.menu:active, a.menu:hover, a.menu:visited {
display:block;
[B]margin:0px auto;[/B][I]/*aber das braucht der IE*/[/I]
width:80%;
text-decoration:none;
}
a.menu:hover {
text-decoration:underline;
}