Thomas_Uni: Tabellenrahmen in Firefox gut, im IE nicht

Hallo,

ich habe ein Problem mit einer eigentlich simplen Angelegenheit. Ich möchte eine einfache Tabelle ausgeben, bei der alle Tabellenelemente umrahmt sind.

Hier der Link:
http://novactest.iup.uni-heidelberg.de/test/test_rahmen.html

In Firefox bekomme ich die gewünschte, dünne Linie, im IE sieht es nach Murks aus.

Die Tabelle wird so definiert:
<table border='1' cellpadding='8' cellspacing='0' style='margin-left: 10px; border-width: 1px; border-color: #000000;' rules='all'>

Ich weiß, ihr werdet sagen, der Mischmasch aus HTML und CSS ist auch Murks, nur, ich probiere seit einer Stunde alles mögliche aus, nur HTML, nur CSS und ich bekomme es einfach nicht anders hin (bei Firefox). Der IE scheint aber auch den "rules" Befehl zu ignorieren.

Falls mir jemand sagen könnte, wie ich das, so wie es in Firefox aussieht, mit sauberem CSS hinbekomme, wäre ich super dankbar.

Gruß
Thomas

  1. Benutz doch <div> mit rahmen.

    1. Benutz doch <div> mit rahmen.

      Das wäre eher ungünstig, weil die Tabelle dynamisch aus einer Datenbankabfrage generiert wird und mein PHP-File schon voll von <tr>- und <td> - Elementen ist, die ich ungern alle ersetzen würde, wenn es nicht auch einfacher ginge.

  2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <!-- saved from url=(0060)http://novactest.iup.uni-heidelberg.de/test/test_rahmen.html -->
    <HTML><HEAD>
    <META http-equiv=Content-Type content="text/html; charset=utf-8">
    <META content="Microsoft FrontPage 5.0" name=GENERATOR></HEAD>
    <BODY>
    <TABLE
    style="BORDER-TOP-WIDTH: 1px; BORDER-LEFT-WIDTH: 1px; BORDER-LEFT-COLOR: #000000; BORDER-BOTTOM-WIDTH: 1px; BORDER-BOTTOM-COLOR: #000000; MARGIN-LEFT: 10px; BORDER-TOP-COLOR: #000000; BORDER-RIGHT-WIDTH: 1px; BORDER-RIGHT-COLOR: #000000"
    cellSpacing=0 cellPadding=8 rules=all border=1>
      <TBODY>
      <TR class=search_table_header style="TEXT-ALIGN: center">
        <TD style="border-style: solid; border-width: 1">Volcano</TD>
        <TD colSpan=3 style="border-style: solid; border-width: 1">Instrument</TD>
        <TD colSpan=8 style="border-style: solid; border-width: 1">Scan</TD></TR>
      <TR class=search_table_header style="TEXT-ALIGN: center">
        <TD style="border-style: solid; border-width: 1"><A
          href="http://novactest.iup.uni-heidelberg.de/test/help.php#volcano.name"
          target=_blank>Name</A></TD>
        <TD style="border-style: solid; border-width: 1"><A
          href="http://novactest.iup.uni-heidelberg.de/test/help.php#instrument.code"
          target=_blank>Code</A></TD>
        <TD style="border-style: solid; border-width: 1"><A
          href="http://novactest.iup.uni-heidelberg.de/test/help.php#instrument.number"
          target=_blank>Number</A></TD>
        <TD style="border-style: solid; border-width: 1"><A
          href="http://novactest.iup.uni-heidelberg.de/test/help.php#instrument.comment"
          target=_blank>Comment</A></TD>
        <TD style="border-style: solid; border-width: 1"><A
          href="http://novactest.iup.uni-heidelberg.de/test/help.php#scan.code"
          target=_blank>Code</A></TD>
        <TD style="border-style: solid; border-width: 1"><A
          href="http://novactest.iup.uni-heidelberg.de/test/help.php#scan.measurement_mode"
          target=_blank>Measurement Mode</A></TD>
        <TD style="border-style: solid; border-width: 1"><A
          href="http://novactest.iup.uni-heidelberg.de/test/help.php#scan.elevation"
          target=_blank>Elevation</A></TD>
        <TD style="border-style: solid; border-width: 1"><A
          href="http://novactest.iup.uni-heidelberg.de/test/help.php#scan.start_time"
          target=_blank>Start Time</A></TD>
        <TD style="border-style: solid; border-width: 1"><A
          href="http://novactest.iup.uni-heidelberg.de/test/help.php#scan.site_number"
          target=_blank>Site Number</A></TD>
        <TD style="border-style: solid; border-width: 1"><A
          href="http://novactest.iup.uni-heidelberg.de/test/help.php#scan.so2_flux"
          target=_blank>SO2 Flux</A></TD>
        <TD style="border-style: solid; border-width: 1"><A
          href="http://novactest.iup.uni-heidelberg.de/test/help.php#scan.wind_speed"
          target=_blank>Wind Speed</A></TD>
        <TD style="border-style: solid; border-width: 1"><A
          href="http://novactest.iup.uni-heidelberg.de/test/help.php#scan.plume_height"
          target=_blank>Plume Height</A></TD></TR>
      <TR>
        <TD class=search_table_array_left style="border-style: solid; border-width: 1">Popocatepetl, Mexico</TD>
        <TD class=search_table_array_right style="border-style: solid; border-width: 1">0012</TD>
        <TD class=search_table_array_right style="border-style: solid; border-width: 1">3</TD>
        <TD class=search_table_array_left style="border-style: solid; border-width: 1">west of volcano</TD>
        <TD class=search_table_array_right style="border-style: solid; border-width: 1">0006</TD>
        <TD class=search_table_array_right style="border-style: solid; border-width: 1">1</TD>
        <TD class=search_table_array_right style="border-style: solid; border-width: 1">0</TD>
        <TD class=search_table_array_left style="border-style: solid; border-width: 1">2006-07-24 11:41:10</TD>
        <TD class=search_table_array_right style="border-style: solid; border-width: 1">1</TD>
        <TD class=search_table_array_right style="border-style: solid; border-width: 1">6.78</TD>
        <TD class=search_table_array_right style="border-style: solid; border-width: 1">0</TD>
        <TD class=search_table_array_right style="border-style: solid; border-width: 1">3207</TD></TR>
      <TR>
        <TD class=search_table_array_left
          style="border-style:solid; border-width:1; BACKGROUND-COLOR: #EFEFEF">Popocatepetl, Mexico</TD>
        <TD class=search_table_array_right
        style="border-style:solid; border-width:1; BACKGROUND-COLOR: #EFEFEF">0012</TD>
        <TD class=search_table_array_right style="border-style:solid; border-width:1; BACKGROUND-COLOR: #EFEFEF">3</TD>
        <TD class=search_table_array_left style="border-style:solid; border-width:1; BACKGROUND-COLOR: #EFEFEF">west
          of volcano</TD>
        <TD class=search_table_array_right
        style="border-style:solid; border-width:1; BACKGROUND-COLOR: #EFEFEF">0005</TD>
        <TD class=search_table_array_right style="border-style:solid; border-width:1; BACKGROUND-COLOR: #EFEFEF">1</TD>
        <TD class=search_table_array_right style="border-style:solid; border-width:1; BACKGROUND-COLOR: #EFEFEF">0</TD>
        <TD class=search_table_array_left
          style="border-style:solid; border-width:1; BACKGROUND-COLOR: #EFEFEF">2006-07-24 11:35:10</TD>
        <TD class=search_table_array_right style="border-style:solid; border-width:1; BACKGROUND-COLOR: #EFEFEF">1</TD>
        <TD class=search_table_array_right
        style="border-style:solid; border-width:1; BACKGROUND-COLOR: #EFEFEF">4.93</TD>
        <TD class=search_table_array_right style="border-style:solid; border-width:1; BACKGROUND-COLOR: #EFEFEF">0</TD>
        <TD class=search_table_array_right
        style="border-style:solid; border-width:1; BACKGROUND-COLOR: #EFEFEF">1963</TD></TR></TBODY></TABLE></BODY></HTML>

    1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
      <!-- saved from url=(0060)http://novactest.iup.uni-heidelberg.de/test/test_rahmen.html -->
      <HTML><HEAD> ...

      Hallo Jürgen,

      danke für das Listing, aber im IE wird der Rahmen leider mit einer Dicke von 2 Pixeln dargestellt, was nicht gut aussieht. Ich konnte das auch durch Ändern der verschiedenen Border-Werte nicht verbessern...

      Gruß
      Thomas

  3. Moin.

    ich habe ein Problem mit einer eigentlich simplen Angelegenheit. Ich möchte eine einfache Tabelle ausgeben, bei der alle Tabellenelemente umrahmt sind.

    Hier der Link:
    http://novactest.iup.uni-heidelberg.de/test/test_rahmen.html

    Das, was Du hier verlinkt hast, ist kein HTML. Der Vorwurf gegen die Browser sollte eigentlich lauten: Warum zeigen die überhaupt etwas an, so ganz ohne Grundgerüst einer HTML-Datei?

    Schreibe valides HTML/CSS und wähle einen DOCTYPE, der den IE zwingt, das richtige Box-Modell zu benutzen.
    Dann klappts auch mit den Rahmen.

    Gruß Frank

    1. Moin.

      ich habe ein Problem mit einer eigentlich simplen Angelegenheit. Ich möchte eine einfache Tabelle ausgeben, bei der alle Tabellenelemente umrahmt sind.

      Hier der Link:
      http://novactest.iup.uni-heidelberg.de/test/test_rahmen.html

      Das, was Du hier verlinkt hast, ist kein HTML. Der Vorwurf gegen die Browser sollte eigentlich lauten: Warum zeigen die überhaupt etwas an, so ganz ohne Grundgerüst einer HTML-Datei?

      Schreibe valides HTML/CSS und wähle einen DOCTYPE, der den IE zwingt, das richtige Box-Modell zu benutzen.
      Dann klappts auch mit den Rahmen.

      Gruß Frank

      Hallo Frank,

      danke für deine Antwort.

      Der Code unter angegebenem Link war natürlich nur ein Ausschnitt aus der eigentlichen Datei. Die Tabelle wird aus PHP heraus dynamisch erzeugt, daher hatte ich aus der erzeugten HTML-Datei nur das Wesentliche ausgeschnitten.

      Ich habe jetzt, wie du vorgeschlagen hast, den Doc-Type mit angegeben (siehe obiger Link), so daß mein IE (7.0) das korrekte Box-Modell wählen sollte. An der Darstellung hat sich leider noch nichts geändert: Mozilla-Browser gut, IE (6.0, 7.0) schlecht.

      Mein Problem ist nach wie vor, daß ich es nicht hinbekomme, die Rahmenlinien im IE zu reproduzieren. Setzt man sie um die <td>, bekommt man Linien mit der Breite von 2px. Es muß doch möglich sein, das im <table>-Tag zu regeln, oder geht das gar nicht, bekommt man über die dortige Angabe von

      border="1"

      lediglich die normalen, häßlichen Rahmenlinien?

      Gruß
      Thomas

  4. Hallo Thomas

    Die Tabelle wird so definiert:
    <table border='1' cellpadding='8' cellspacing='0' style='margin-left: 10px; border-width: 1px; border-color: #000000;' rules='all'>

    Ich weiß, ihr werdet sagen, der Mischmasch aus HTML und CSS ist auch Murks,  nur, ich probiere seit einer Stunde alles mögliche aus, nur HTML, nur CSS und ich bekomme es einfach nicht anders hin (bei Firefox). Der IE scheint aber auch den "rules" Befehl zu ignorieren.

    Was soll das rules-Attribut bewirken?
    Wenn du es nicht angibst werden bei border="1" doch üblicherweise alle Rahmen angezeigt.

    Kann es sein, dass die Rahmen im IE nicht wirklich 2px breit sind, sondern nur so scheinen, weil ja immer zwei 1px breite Rahmen aneinanderstoßen?

    Falls mir jemand sagen könnte, wie ich das, so wie es in Firefox aussieht, mit sauberem CSS hinbekomme, wäre ich super dankbar.

    Hast du mal versucht, das von dir gewünschte Rahmenmodell anzugeben?

    Auf Wiederlesen
    Detlef

    --
    - Wissen ist gut
    - Können ist besser
    - aber das Beste und Interessanteste ist der Weg dahin!