Christopher: Tabelle wird in den Browsern verschieden angezeigt...

SELF-Forum

Tabelle wird in den Browsern verschieden angezeigt...

Christopher
– Informationen zu den Bewertungsregeln

Hi,

diese Tabelle wird in den Browsern verschieden angezeigt...

Im IE wird sie richtig angezeigt. Ich kann nur leider nicht den Fehler finden...  (PS: Die IDs/Class sind nur Farbangaben)

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta name="generator" content="HTML Tidy, see www.w3.org">
<title></title>
</head>
<body>
<table border="0" summary="Meine Homepage - Mindstorms" width=
"100%" style="empty-cells:show;" cellspacing="0px" cellpadding=
"0px">
<tr height="5px">
<td colspan="7">
<table border="0" cellspacing="" cellpadding="0" width="100%"
height="5px" summary="0">
<tr>
<td style="BACKGROUND-COLOR: #e9e9e9"></td>
<td style="BACKGROUND-COLOR: #ebebeb"></td>
<td style="BACKGROUND-COLOR: #ececec"></td>
<td style="BACKGROUND-COLOR: #eeeeee"></td>
<td style="BACKGROUND-COLOR: #efefef"></td>
<td style="BACKGROUND-COLOR: #f1f1f1"></td>
<td style="BACKGROUND-COLOR: #f2f2f2"></td>
<td style="BACKGROUND-COLOR: #f4f4f4"></td>
<td style="BACKGROUND-COLOR: #f6f6f6"></td>
<td style="BACKGROUND-COLOR: #f7f7f7"></td>
<td style="BACKGROUND-COLOR: #f9f9f9"></td>
<td style="BACKGROUND-COLOR: #fafafa"></td>
<td style="BACKGROUND-COLOR: #fcfcfc"></td>
<td style="BACKGROUND-COLOR: #fdfdfd"></td>
<td style="BACKGROUND-COLOR: #ffffff"></td>
</tr>
</table>
</td>
</tr>

<tr height="1px">
<td colspan="7"></td>
</tr>

<tr height="48px">
<td style="background: RGB(224,224,224);" width="385px"></td>
<td width="1px"></td>
<td id="bgmi4"></td>
<td width="1px"></td>
<td width="15px" style="background: #ffffff;"></td>
<td width="1px"></td>
<td width="50px" id="bgmi24"></td>
</tr>

<tr height="2px">
<td colspan="4"></td>
<td style="background:#000000"></td>
<td colspan="2"></td>
</tr>

<tr height="16px">
<td style="background: RGB(214,214,214);" width="385px"></td>
<td width="1px"></td>
<td style="background: #dcdcdc;" onmouseover=
"this.style.backgroundColor='RGB(214,214,214)'" onmouseout=
"this.style.backgroundColor='#dcdcdc'"></td>
<td width="1px"></td>
<td width="15px" style="background: #ffffff;"></td>
<td width="1px"></td>
<td style="background: RGB(214,214,214);" width="50px" onmouseover=
"this.style.backgroundColor='#dcdcdc'" onmouseout=
"this.style.backgroundColor='RGB(214,214,214)'"></td>
</tr>

<tr height="1px">
<td colspan="7"></td>
</tr>

<tr height="5px">
<td colspan="3" style="background:#E0E5EA;"></td>
<td colspan="3" style="background:#000077;" width="20px"></td>
<td style="background: #E0E5EA;" width="5px"></td>
</tr>
</table>
</body>
</html>

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Tabelle wird in den Browsern verschieden angezeigt...

    Ingo Homepage des Autors
    – Informationen zu den Bewertungsregeln

    Hi,

    es könnte sein, daß style="empty-cells:show;" hier Unterschiede verursacht.
    Nur: ich sehe keinen Nutzen in einer derartigen Tabellenkostruktion. Beschäftige Dich doch lieber ausschließlich mit CSS, um das gewünschte Layout zu erzeugen.

    freundliche Grüße
    Ingo

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

  2. Tabelle wird in den Browsern verschieden angezeigt...

    Axel Richter
    – Informationen zu den Bewertungsregeln

    Hallo,

    diese Tabelle wird in den Browsern verschieden angezeigt...

    Das ist völlig normal, da kein Browser existiert, der die Standards 100%ig umsetzt. Mit kleinen Unterschieden muss man also leben.

    Im IE wird sie richtig angezeigt.

    Nein. Im IE wird sie so angezeigt, wie Du sie angezeigt haben möchtest. Das ist in 100% solcher Fälle _nicht_ richtig, nach w3c-Standard.

    Ich kann nur leider nicht den Fehler finden...  (PS: Die IDs/Class sind nur Farbangaben)

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

    Benutze eine vollständige Dokumenttyp-Angabe. Siehe SelfHTML.

    <html>
    <head>
    <meta name="generator" content="HTML Tidy, see www.w3.org">
    <title></title>

    Benutze ein gültiges TITLE Element.

    </head>
    <body>
    <table border="0" summary="Meine Homepage - Mindstorms" width=
    "100%" style="empty-cells:show;" cellspacing="0px" cellpadding=
    "0px">
    <tr height="5px">

    Das Element TR hat kein Attribut height. Benutze CSS.

    <td colspan="7">
    <table border="0" cellspacing="" cellpadding="0" width="100%"
    height="5px" summary="0">

    Auch das Element TABLE hat kein Attribut height. Benutze auch hier CSS.

    <tr>
    <td style="BACKGROUND-COLOR: #e9e9e9"></td>
    <td style="BACKGROUND-COLOR: #ebebeb"></td>
    <td style="BACKGROUND-COLOR: #ececec"></td>
    <td style="BACKGROUND-COLOR: #eeeeee"></td>
    <td style="BACKGROUND-COLOR: #efefef"></td>
    <td style="BACKGROUND-COLOR: #f1f1f1"></td>
    <td style="BACKGROUND-COLOR: #f2f2f2"></td>
    <td style="BACKGROUND-COLOR: #f4f4f4"></td>
    <td style="BACKGROUND-COLOR: #f6f6f6"></td>
    <td style="BACKGROUND-COLOR: #f7f7f7"></td>
    <td style="BACKGROUND-COLOR: #f9f9f9"></td>
    <td style="BACKGROUND-COLOR: #fafafa"></td>
    <td style="BACKGROUND-COLOR: #fcfcfc"></td>
    <td style="BACKGROUND-COLOR: #fdfdfd"></td>
    <td style="BACKGROUND-COLOR: #ffffff"></td>
    </tr>

    Was spricht dagegen den Zellen einen Inhalt, z.B.:  , zu geben?

    </table>
    </td>
    </tr>

    <tr height="1px">

    Hat TR ein Attribut height?

    <td colspan="7"></td>
    </tr>

    <tr height="48px">

    Hat TR ein Attribut height?

    <td style="background: RGB(224,224,224);" width="385px"></td>

    Bitte verwende die CSS-Eigenschaft BACKGROUND nur, wen Du wirklich mehrere Hintergrund-Eigenschaften einstellen möchtest. Für die Hintergrundfarbe verwende BACKGROUND-COLOR.

    <td width="1px"></td>
    <td id="bgmi4"></td>
    <td width="1px"></td>
    <td width="15px" style="background: #ffffff;"></td>

    Du willst die Hintergrund-Farbe angeben! #FFFFFF === #FFF.

    <td width="1px"></td>
    <td width="50px" id="bgmi24"></td>

    Was spricht dagegen den Zellen einen Inhalt, z.B.:  , zu geben? Eventuell musst Du noch Schriftgröße und Zeilenhöhe mit CSS vorgeben.

    </tr>

    <tr height="2px">

    Hat TR ein Attribut height?

    <td colspan="4"></td>
    <td style="background:#000000"></td>
    <td colspan="2"></td>

    Was spricht dagegen den Zellen einen Inhalt, z.B.:  , zu geben?

    </tr>

    <tr height="16px">

    Hat TR ein Attribut height?

    <td style="background: RGB(214,214,214);" width="385px"></td>

    Du willst die Hintergrund-Farbe angeben!

    <td width="1px"></td>
    <td style="background: #dcdcdc;" onmouseover=

    Du willst die Hintergrund-Farbe angeben!

    "this.style.backgroundColor='RGB(214,214,214)'" onmouseout=
    "this.style.backgroundColor='#dcdcdc'"></td>
    <td width="1px"></td>
    <td width="15px" style="background: #ffffff;"></td>

    Du willst die Hintergrund-Farbe angeben! #FFFFFF === #FFF.

    <td width="1px"></td>
    <td style="background: RGB(214,214,214);" width="50px" onmouseover=
    "this.style.backgroundColor='#dcdcdc'" onmouseout=
    "this.style.backgroundColor='RGB(214,214,214)'"></td>

    Was spricht dagegen den Zellen einen Inhalt, z.B.:  , zu geben?

    </tr>

    <tr height="1px">

    Hat TR ein Attribut height?

    <td colspan="7"></td>

    Was spricht dagegen den Zellen einen Inhalt, z.B.:  , zu geben?

    </tr>

    <tr height="5px">

    Hat TR ein Attribut height?

    <td colspan="3" style="background:#E0E5EA;"></td>
    <td colspan="3" style="background:#000077;" width="20px"></td>
    <td style="background: #E0E5EA;" width="5px"></td>
    </tr>

    Was spricht dagegen den Zellen einen Inhalt, z.B.:  , zu geben?

    </table>
    </body>
    </html>

    viele Grüße

    Axel

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Tabelle wird in den Browsern verschieden angezeigt...

      wahsaga Homepage des Autors
      – Informationen zu den Bewertungsregeln

      hi,

      <td style="background: RGB(224,224,224);" width="385px"></td>
      Bitte verwende die CSS-Eigenschaft BACKGROUND nur, wen Du wirklich mehrere Hintergrund-Eigenschaften einstellen möchtest. Für die Hintergrundfarbe verwende BACKGROUND-COLOR.

      gibt's eine logische begründung, warum man dies tun sollte?

      gruss,
      wahsaga

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. Tabelle wird in den Browsern verschieden angezeigt...

        Axel Richter
        – Informationen zu den Bewertungsregeln

        Hallo,

        <td style="background: RGB(224,224,224);" width="385px"></td>
        Bitte verwende die CSS-Eigenschaft BACKGROUND nur, wen Du wirklich mehrere Hintergrund-Eigenschaften einstellen möchtest. Für die Hintergrundfarbe verwende BACKGROUND-COLOR.
        gibt's eine logische begründung, warum man dies tun sollte?

        Ja, gibt es. CSS ist kaskadiert, das heißt mehrstufig. Wenn Du in der letzten Stufe, z.B. im style-Attribut, background:#fff; einsetzt, dann gehen ggf. vorher eingestellte Background-Eigenschaften(Bilder usw.) verloren. Es gilt nämlich:
        http://www.w3.org/TR/REC-CSS2/colors.html#background-properties
        The 'background' property first sets all the individual background properties to their initial values, then assigns explicit values given in the declaration.

        viele Grüße

        Axel

        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

        1. Tabelle wird in den Browsern verschieden angezeigt...

          wahsaga Homepage des Autors
          – Informationen zu den Bewertungsregeln

          hi,

          Ja, gibt es. CSS ist kaskadiert, das heißt mehrstufig. Wenn Du in der letzten Stufe, z.B. im style-Attribut, background:#fff; einsetzt, dann gehen ggf. vorher eingestellte Background-Eigenschaften(Bilder usw.) verloren.

          einleuchtende erklärung, vielen dank.

          gruss,
          wahsaga

          Beitrag melden
          –
          Informationen zu den Bewertungsregeln

    2. Tabelle wird in den Browsern verschieden angezeigt...

      Sven Rautenberg Homepage des Autors
      – Informationen zu den Bewertungsregeln

      Moin!

      <table border="0" summary="Meine Homepage - Mindstorms" width=
      "100%" style="empty-cells:show;" cellspacing="0px" cellpadding=
      "0px">
      <tr height="5px">
      Das Element TR hat kein Attribut height. Benutze CSS.

      Den offensichtlichsten (oder auch nicht) Fehler hast du aber nicht angemeckert: width und (sofern vom Browser tatsächlich akzeptiert - im Standard stehts jedenfalls nicht drin) height als Attribute von HTML-Elementen erfordern entweder eine Zahlenangabe (z.B. "5"), die dann "Pixel" bedeutet, oder eine Prozentangabe (z.B. "5%"). Keinesfalls aber ist die Angabe "5px" korrekt. Insofern ist die unterschiedliche Darstellung in den Browsern vermutlich allein auf diese fehlerhafte Maßangabe zurückzuführen.

      Merke: CSS erfordert immer eine Einheitsangabe, HTML hingegen erwartet meist nur eine einheitenlose Zahlenangabe, die dann als "Pixel" interpretiert wird.

      Da hier ohnehin schon reichlich CSS zur Anwendung kommt: Warum nicht auf formatierende HTML-Attribute komplett verzichten und alles mit CSS machen?

      - Sven Rautenberg

      --
      ss:) zu:) ls:[ fo:} de:] va:) ch:] sh:) n4:# rl:| br:< js:| ie:( fl:( mo:|
      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. Tabelle wird in den Browsern verschieden angezeigt...

        Axel Richter
        – Informationen zu den Bewertungsregeln

        Hallo Sven,

        Den offensichtlichsten (oder auch nicht) Fehler hast du aber nicht angemeckert: width und (sofern vom Browser tatsächlich akzeptiert - im Standard stehts jedenfalls nicht drin) height als Attribute von HTML-Elementen erfordern entweder eine Zahlenangabe (z.B. "5"), die dann "Pixel" bedeutet, oder eine Prozentangabe (z.B. "5%"). Keinesfalls aber ist die Angabe "5px" korrekt. Insofern ist die unterschiedliche Darstellung in den Browsern vermutlich allein auf diese fehlerhafte Maßangabe zurückzuführen.

        Das glaube ich nicht. W3C-konforme Browser interpretieren height in TABLE und TR _überhaupt_ nicht, auch nicht height="50".

        Merke: CSS erfordert immer eine Einheitsangabe, HTML hingegen erwartet meist nur eine einheitenlose Zahlenangabe, die dann als "Pixel" interpretiert wird.

        Ja, das hatte ich übersehen. Allerdings haben sowohl die Entity %Length als auch die Entity %Pixels den Inhalt CDATA. Das ist allgemeiner Zeichen-Inhalt. Laut DTD ist also width="200px" valide. Es hängt vom Browser ab, ob das als Integer 200 interpretiert wird.

        Da hier ohnehin schon reichlich CSS zur Anwendung kommt: Warum nicht auf formatierende HTML-Attribute komplett verzichten und alles mit CSS machen?

        Das habe ich auch versucht vorzuschlagen. Hier stimme ich Dir also voll zu.

        viele Grüße

        Axel

        Beitrag melden
        –
        Informationen zu den Bewertungsregeln