susi999: "width-Parameter" im CSS wirkt sich auf die Tabelle nicht aus

Hallo Forum!
Irgendwie schaffe ich es nicht, das "Width" im CSS für meine Tabelle richtig anzugeben. Ich möchte einen %-Wert angeben, sprich wieviel % die Tabelle auf der Seite einnehmen darf.
Egal, welchen Wert ich angebe, die Tabelle füllt immer die ganze Breite aus, bis auf ca. 2mm links.

So schaut meine CSS-Zeile aus:
table.tab1 {background-color:#ffffff; width:85%; align:center; margin-left: auto; margin-right: auto;}

Und im HTML nehme ich folgendermaßen darauf Bezug:
<table class="tab1"
style="background-color: rgb(0, 102, 102); height: 622px; text-align: left;"
frame="box" rules="none" border="4" bordercolor="#006666"
cellpadding="2" cellspacing="0">

Was stimmt daran nicht? Es ist nicht so, dass das ganze CSS falsch ist, nur eben die Tabellenbreite haut nicht hin.

Danke für Eure Antworten!

  1. @@susi999:

    nuqneH

    So schaut meine CSS-Zeile aus:
    table.tab1 {background-color:#ffffff; width:85%; align:center; margin-left: auto; margin-right: auto;}

    Es gibt keine CSS-Eigenschaft 'align'.

    Und im HTML nehme ich folgendermaßen darauf Bezug:

    Nein. Du nimmst im Stylesheet Bezug auf dein HTML, niemals andersrum.

    <table class="tab1"
    style="background-color: rgb(0, 102, 102); height: 622px; text-align: left;"
    frame="box" rules="none" border="4" bordercolor="#006666"
    cellpadding="2" cellspacing="0">

    Was stimmt daran nicht?

    Du notierst CSS-Eigenschaften inline im HTML-Code im @style-Attribut anstatt diese im Stylesheet zu notieren.

    Du verwendest missbilligte HTML-Attribute zur Darstellung anstatt CSS-Eigenschaften.

    Und möglicherweise auch: Du verwendest eine Tabelle zum Layouten.

    Es ist nicht so, dass das ganze CSS falsch ist, nur eben die Tabellenbreite haut nicht hin.

    Ohne den Tabelleninhalt zu kennen, lässt sich dazu kaum Genaueres sagen (außer der Vermutung von 'table-layout: fixed').

    Online-Beispiel, bitte.

    Qapla'

    --
    Wer möchte nicht lieber durch Glück dümmer als durch Schaden klüger werden? (Salvador Dalí)
    1. Hallo,

      table.tab1 {background-color:#ffffff; width:85%; align:center; margin-left: auto; margin-right: auto;}

      Es gibt keine CSS-Eigenschaft 'align'.

      außerdem mutmaße ich mal, dass das übergeordnete Element keine feste Breite hat, und die Angabe 85% daher freischwebend in der Luft steht und ignoriert wird, weil sie einen Zirkelbezug (Excel-Terminologie) verursacht.

      Ciao,
       Martin

      --
      Ein Ehepaar beim Sex. Sie fragt ihn: "Woran denkst du gerade?" - Er antwortet: "Kennste sowieso nicht."
      Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
      1. Hallo, hier ist mein HTML-Code. Erstellt habe ich das mit Seamonkey und dann händisch ein paar Anpassungen gemacht. Ich weiß nicht, seit wann und wodurch die Breite so groß war, früher war links und rechts ca. 1cm Rand (auf meinem Laptop-Bildschirm).

        Grüße,
        Susi

        <html>
        <head>
        <meta name="keywords"
        content="Kontent, noch ein Kontent, wieder ein Kontent">
        <link href="Hyperlink.css" rel="stylesheet" type="text/css">
        <link rel="stylesheet" type="text/css" href="stylesheets/style0.css">
        <style type="text/css">
        <!--
        -->
        </style>
        <meta http-equiv="Content-Type"
        content="text/html; charset=ISO-8859-1">
        <title>Titel Titel Titel</title>
        </head>
        <body
        style="color: rgb(0, 0, 0); background-color: rgb(0, 204, 255); background-image: url(bilder/hintergrundbild.jpg);"
        link="#000000" alink="#000099" vlink="#000000">
        <table
        style="background-color: rgb(0, 255, 204); width: 80%; height: 622px; text-align: left; margin-left: auto; margin-right: auto;"
        frame="box" rules="none" border="4" bordercolor="#006666"
        cellpadding="2" cellspacing="0">
        <tbody>
        <tr>
        <td colspan="3" rowspan="1"
        style="height: 120px; vertical-align: top;">
        <table style="text-align: left; width: 100%;" border="0"
        cellpadding="0" cellspacing="0">
        <tbody>
        <tr>
        <td style="vertical-align: top; height: 120px; width: 50%;"><small><a
        name="home"></a></small><img style="width: 480px; height: 120px;"
        alt="Alternativtext" src="bilder/logo.jpg"><br>
        </td>
        <td
        style="vertical-align: top; width: 50%; text-align: right; height: 120px;"><img
        style="width: 160px; height: 120px;" alt="" src="bilder/bild1.jpg">&nbsp;
        <img style="width: 160px; height: 120px;" alt=""
        src="bilder/bild3.jpg">&nbsp; <img
        style="width: 160px; height: 120px;" alt="" src="bilder/bild2.jpg"><br>
        </td>
        </tr>
        </tbody>
        </table>
        </td>
        </tr>
        <tr>
        <td colspan="3" rowspan="1"
        style="vertical-align: top; background-color: rgb(255, 255, 255); height: 20px;"><a
        href="index.html">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
        &nbsp; &nbsp; &nbsp; &nbsp; <small> <span style="color: rgb(0, 0, 0);"></span></small></a>
        </td>
        </tr>
        <tr bordercolor="0">
        <td
        style="vertical-align: top; width: 70px; background-color: rgb(255, 255, 255);">
        <big><span style="color: rgb(0, 0, 0);"></span></big>
        <table style="text-align: left; width: 147px; height: 217px;"
        cellpadding="2" cellspacing="5">
        <tbody>
        <tr>
        <td style="vertical-align: top;"><big
        style="color: rgb(0, 0, 0);"><a href="index.html">HOME</a><br>
        <hr> </big><big style="color: rgb(0, 0, 0);"><a
        href="link1">LINK1</a><br>
        <hr></big><a style="color: rgb(0, 0, 0);" href="link2.htm"><big>LINK2</big></a><big
        style="color: rgb(0, 0, 0);">
        <hr><a href="link5.htm">LINK5</a><br>
        <hr><a style="color: rgb(0, 0, 0);" href="link7.htm">LINK7</a><br>
        </big><big style="color: rgb(0, 0, 0);">
        <hr><a href="link6.htm"></a></big><br>
        </td>
        </tr>
        </tbody>
        </table>
        </td>
        <td
        style="vertical-align: top; background-color: rgb(255, 255, 255); width: 5px;"><br>
        </td>
        <td
        style="background-color: rgb(255, 255, 255); vertical-align: top;">
        <table style="text-align: left; width: 1107px; height: 471px;"
        frame="lhs" rules="none" border="2" bordercolor="#999999"
        cellpadding="4" cellspacing="4">
        <tbody>
        <tr>
        <td style="vertical-align: top;">
        <h1>&Uuml;berschrift:</h1>
        <br>
        <font face="Georgia, Times New Roman, Times, serif">Text...<br>
        <br>
        <br>
        <br>
        <br>
        <br>
        </td>
        </tr>
        </tbody>
        </table>
        <br>
        </td>
        </tr>
        <tr>
        <td
        style="vertical-align: top; background-color: rgb(255, 255, 255); text-align: left;"
        rowspan="1" colspan="3"><font
        face="Georgia, Times New Roman, Times, serif" size="-6"><big>&nbsp;&nbsp;
        </big></font><font face="Georgia, Times New Roman, Times, serif"
        size="-6"><big> <br>
        </big></font><font face="Georgia, Times New Roman, Times, serif"
        size="-6"><big><br>
        </big></font>
        <table style="text-align: left; width: 100%;" border="0"
        cellpadding="0" cellspacing="0">
        <tbody>
        <tr>
        <td style="vertical-align: top; width: 20%;"><font
        face="Georgia, Times New Roman, Times, serif" size="-6"><big>&nbsp;&copy;
        </big></font><font
        face="Georgia, Times New Roman, Times, serif" size="-6"><big>Blablablabla

        <br>
        </big></font></td>
        <td
        style="vertical-align: top; width: 60%; text-align: center;"><font
        face="Georgia, Times New Roman, Times, serif" size="-6"><big><a
        href="link99.htm">Link99</a></big></font></td>
        <td
        style="vertical-align: top; text-align: right; width: 20%;"><small><span
        style="text-decoration: underline;">Blabla</span> </small><br>
        </td>
        </tr>
        </tbody>
        </table>
        <div style="text-align: right;"><font
        face="Georgia, Times New Roman, Times, serif" size="-6"> </font></div>
        </td>
        </tr>
        </tbody>
        </table>
        </body>
        </html>