✔ Tabelle in Opera und IE

Status
Nicht offen für weitere Antworten.
mhribernik

mhribernik

Erfahrenes Mitglied
Hi!

Wieder ein mal hab ich ein Problem:

Ich habe folgenden Code:
HTML: 
<html>

<head>
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>
</head>

<body>

<div align="left">
  <table  width="355" height="280" id="AutoNumber1" align="left" cellspacing="1" bordercolor="#C0C0C0">
    <tr>
      <td width="355" height="280" style="border-style: solid; border-width: 1" valign="top">Inhalt</td>
    </tr>
  </table>
</div>

</body>

</html>

Wenn ich ihn im Internet Explorer ausführe, wird die Tabelle korrekt, also in der Farbe #C0C0C0, angezeigt.

Wenn ich ihn jedoch in Opera 8 ausführe, ist der Rahmen der Tabelle schwarz.

Warum ist das so? Wasmuss ich ändern?
Dannke im voraus.
 
Re: Tabelle in Operaund IE

Den Tabellenrahmen mit CSS formatieren:

Code: 
table, td { border: 1px solid #c0c0c0; }
und das bordercolor- Attribut aus dem HTML-Source entfernen ;-]
 
Re: Tabelle in Operaund IE

Wie mache ich das genau?

Ich habs mit Style Sheets noch nie versucht. Könntest du mir kurz ein Beispiel posten?

Danke im voraus.
 
Re: Tabelle in Operaund IE

Kein Problem ;-]

HTML: 
<html>

<head>
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>

<style type="text/css">
<!--
table, td { border: 1px solid #c0c0c0; }

table#AutoNumber1 { width: 355px; height: 280px; text-align: left; }
-->
</style>
</head>

<body>

<div align="left">
  <table id="AutoNumber1" cellspacing="1">
    <tr>
      <td width="355" height="280" valign="top">Inhalt</td>
    </tr>
  </table>
</div>

</body>

</html>
 
Danke vielmals!

Ein Frage hätte ich noch:

Muss ich, wenn ich mehrere Tabellen (<table>) mit den selben Eigenschaften habe, für jede einen extra Eintrag tippen:

HTML: 
<html>

<head>
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>

<style type="text/css">
<!--
table, td { border: 1px solid #c0c0c0; }

table#AutoNumber1 { width: 355px; height: 280px; text-align: left; }
table#AutoNumber1 { width: 355px; height: 280px; text-align: left; }
table#AutoNumber1 { width: 355px; height: 280px; text-align: left; }
-->
</style>
</head>

<body>

<div align="left">
  <table id="AutoNumber1" cellspacing="1">
    <tr>
      <td width="355" height="280" valign="top">Inhalt</td>
    </tr>
  </table>
</div>

<div align="left">
  <table id="AutoNumber1" cellspacing="1">
    <tr>
      <td width="355" height="280" valign="top">Inhalt</td>
    </tr>
  </table>
</div>

<div align="left">
  <table id="AutoNumber1" cellspacing="1">
    <tr>
      <td width="355" height="280" valign="top">Inhalt</td>
    </tr>
  </table>
</div>
</body>

</html>
 
Du kannst die ID #AutoNumber1 nicht mehrmals verwenden, sondern nur einmal.

Entweder verwendest du eine CSS-Klasse für alle Tabellen:
Code: 
table, td { border: 1px solid #c0c0c0; }

table.AutoNumber1 { width: 355px; height: 280px; text-align: left; }
HTML: 
<div align="left">
  <table class="AutoNumber1" cellspacing="1">
    <tr>
      <td width="355" height="280" valign="top">Inhalt</td>
    </tr>
  </table>
</div>

<div align="left">
  <table class="AutoNumber1" cellspacing="1">
    <tr>
      <td width="355" height="280" valign="top">Inhalt</td>
    </tr>
  </table>
</div>

<div align="left">
  <table class="AutoNumber1" cellspacing="1">
    <tr>
      <td width="355" height="280" valign="top">Inhalt</td>
    </tr>
  </table>
</div>
oder gibst jeder Tabelle eine ID:

Code: 
table#AutoNumber1 { width: 355px; height: 280px; text-align: left; }
table#AutoNumber2 { width: 355px; height: 280px; text-align: left; }
table#AutoNumber3 { width: 355px; height: 280px; text-align: left; }
vereinfachtes CSS
Code: 
table#AutoNumber1, table#AutoNumber2, table#AutoNumber3 { width: 355px; height: 280px; text-align: left; }
HTML: 
<div align="left">
  <table id="AutoNumber1" cellspacing="1">
    <tr>
      <td width="355" height="280" valign="top">Inhalt</td>
    </tr>
  </table>
</div>

<div align="left">
  <table id="AutoNumber2" cellspacing="1">
    <tr>
      <td width="355" height="280" valign="top">Inhalt</td>
    </tr>
  </table>
</div>

<div align="left">
  <table id="AutoNumber3" cellspacing="1">
    <tr>
      <td width="355" height="280" valign="top">Inhalt</td>
    </tr>
  </table>
</div>
 
Nochmals DANKE!

Es klappt wunderbar.

Das mit dem:
HTML: 
table#AutoNumber1 { width: 355px; height: 280px; text-align: left; }
table#AutoNumber1 { width: 355px; height: 280px; text-align: left; }
table#AutoNumber1 { width: 355px; height: 280px; text-align: left; }

war nur ein Eligkeitsfehler.

Nochmal danke. :)
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück