Constantin Kiesling: Grundlegendes Tabellenproblem

Hallo liebe Community!

Ich habe ein Problem, das mich fast verzweifeln lässt. Ich will ein Design erstellen, das auf einer Tabelle basiert. Diese Tabelle soll im Grundgerüst drei Spalten haben, links eine dünne für die Navigation, in der Mitte eine breitere für den Inhalt und rechts eine genau gleich dünne wie die Linke, für erweiterten Inhalt.

Nun, ich bekomme es aber einfach nicht hin, die linke und die rechte Spalte genau gleich breit hinzubekommen!

Die Tabelle ist fixiert auf eine breite von 750 pixel und wird durch ein <div>-Tag zentriert. Die Spalten links und rechts sollen 150 pixel haben, die mittlere demnach dann 450 pixel. Der logische Code sieht dann so aus:

<html>
<head>

<title>Riesen Problem!</title>

</head>
<body>

<div style="text-align:center">
<table border="1" cellpadding="0" cellspacing="0" width="750" bordercolor="#000000">

<tr>
<td width="150">
Spalte
</td>

<td width="450">
Spalte
</td>

<td width="150">
Spalte
</td>
</tr>

</table>
</div>

</body>
</html>

Bitte probiert diesen Code doch einmal aus! Ihr werdet sehen, dass die rechteste Spalte dennoch immer ein bisschen breiter ist als die Linkeste! Auch mit prozentuellen Breitenangaben für die Spalten wie z.B. 20%, 60%, 20% wird die rechteste und die linkeste Spalte nicht gleich breit!!

Bitte helft mir!
Euer verzweifelter Consti... :)

  1. Hallo,

    hast Du's schon mit einem Blindgif (1x1 Pixel große Grafik) probiert?
    In die 1. und 3. Spalte ein <img width=150 src=blind.gif..>
    einfügen und in der Mitte eins mit width=450.
    Vielleicht liegts auch daran, daß du ein Border=1 eingestellt hast. Ich weiß nicht genau, wie genau das bei der Kalkulation funktioniert, ob es der Browser also denkt:
    750 - 1 (für linken Rand) - 1 (für rechten Rand) = 748
    748 - 150 - 450 = 148
    148 könnte also der Rest sein.
    Aber sicher ist, daß jeder Browser anders rechnet.

    Viel Erfolg noch

    Robert

    Hallo liebe Community!

    Ich habe ein Problem, das mich fast verzweifeln lässt. Ich will ein Design erstellen, das auf einer Tabelle basiert. Diese Tabelle soll im Grundgerüst drei Spalten haben, links eine dünne für die Navigation, in der Mitte eine breitere für den Inhalt und rechts eine genau gleich dünne wie die Linke, für erweiterten Inhalt.

    Nun, ich bekomme es aber einfach nicht hin, die linke und die rechte Spalte genau gleich breit hinzubekommen!

    Die Tabelle ist fixiert auf eine breite von 750 pixel und wird durch ein <div>-Tag zentriert. Die Spalten links und rechts sollen 150 pixel haben, die mittlere demnach dann 450 pixel. Der logische Code sieht dann so aus:

    <html>
    <head>

    <title>Riesen Problem!</title>

    </head>
    <body>

    <div style="text-align:center">
    <table border="1" cellpadding="0" cellspacing="0" width="750" bordercolor="#000000">

    <tr>
    <td width="150">
    Spalte
    </td>

    <td width="450">
    Spalte
    </td>

    <td width="150">
    Spalte
    </td>
    </tr>

    </table>
    </div>

    </body>
    </html>

    Bitte probiert diesen Code doch einmal aus! Ihr werdet sehen, dass die rechteste Spalte dennoch immer ein bisschen breiter ist als die Linkeste! Auch mit prozentuellen Breitenangaben für die Spalten wie z.B. 20%, 60%, 20% wird die rechteste und die linkeste Spalte nicht gleich breit!!

    Bitte helft mir!
    Euer verzweifelter Consti... :)

  2. Hallo Consti,

    dem Code nach müssten die Spalten genau gleich breit sein, und bei mir sehen sie auch genau gleich breit aus. Aber vielleicht habe ich ja einen Knick in der Optik.

    <such>Linotype-Zeichenzähler aus Programmiersteinzeit</such>

    Ach ja, da isser, habe ich früher mal oft gebraucht *grins* Was datten iss? So eine Art durchsichtiges Lineal für verschiedene Schriftarten und Größen. Uns siehe da. Genau gleich breit, die blöde Tabelle....

    Gibt's bei Dir irgendwelche Sonderbedingungen: Brwoser, kapuuten Bildschirm, oder dergl.? Wie hast DU die Ungleichheit festgestellt?

    Neugierig

    Dein Mathias Bigge

    Bitte probiert diesen Code doch einmal aus! Ihr werdet sehen, dass die rechteste Spalte dennoch immer ein bisschen breiter ist als die Linkeste! Auch mit prozentuellen Breitenangaben für die Spalten wie z.B. 20%, 60%, 20% wird die rechteste und die linkeste Spalte nicht gleich breit!!

    Euer verzweifelter Consti... :)

    1. Hallo!

      Gibt's bei Dir irgendwelche Sonderbedingungen: Brwoser, kapuuten Bildschirm, oder dergl.? Wie hast DU die Ungleichheit festgestellt?

      Nein, kein kaputter Bildschirm usw. Ich habe es einfach im IE6 aufgerufen, und anhand eines Lineals direkt vom Bildschirm abgemessen. Auch mit freiem Auge ist es erkennbar, die rechteste Spalte is immer ein wenig breiter als die Linkeste. Ich habe es auch im NS6 getestet, genau dasselbe!

      Weiters hat es auch nichts geholfen, dass ich als Breite 148 px statt 150 verwendet habe (wegen dem Rand). Ich kann nur nochmal sagen... übernehmt exakt den selben Code in eine leere HTML-Datei und es passiert dasselbe bei euch *gg*

      Dennoch - lG& Big Thx @ all!

      1. Hallo Constantin,

        im Mozialla sieht's bei mir auch anständig aus, scheint also ein IE und Netscape 6 Problem zu sein.

        Vielleicht versuchst Du's mal mit CSS-Angaben zu reparieren in der Art von:

        <th style="width:100px">
        <td style="height:100px">

        Ein anderer Versuch wäre vielleicht, eine Leergif in genau passender Größe in die Zellen zu setzen. Kann es im Moment nicht selber ausprobieren, weil ich keinen IE 6 habe und der Netscape 6 sich bei mir mit dem Mozilla einfach nicht vertragen will...

        Irgendwo im Forum gab's schonmal eine Diskussion zu dem Thema, aber ich hab's nicht gefunden....

        Mathias Bigge

        1. Hi Mathias!

          im Mozialla sieht's bei mir auch anständig aus, scheint also ein IE und Netscape 6 Problem zu sein.

          Tjo da kenne ich mich zuwenig aus! :)

          Vielleicht versuchst Du's mal mit CSS-Angaben zu reparieren in der Art von:

          <th style="width:100px">
          <td style="height:100px">

          Ein anderer Versuch wäre vielleicht, eine Leergif in genau passender Größe in die Zellen zu setzen. Kann es im Moment nicht selber ausprobieren, weil ich keinen IE 6 habe und der Netscape 6 sich bei mir mit dem Mozilla einfach nicht vertragen will...

          Das werde ich alles mal testen, danke jedefalls!

          Irgendwo im Forum gab's schonmal eine Diskussion zu dem Thema, aber ich hab's nicht gefunden....

          Kann man nix machen... :) Trotzdem danke vielmals!

          Consti

  3. hi

    wundert mich eigtnlich nicht allzu sehr... Da sind die border="1", also insgesamt 4x 1 Pixel, was runter geht. Versuch den beiden äußeren Spalten mal je eine Breite von 148 Pixeln zu geben.

    Nochwas: Lösch das bordercolor="" aus deinem Wissen.
    Es gibt nur <table style="border-color:#000000;"> und für die Zellen.. <td style="border-color:#000000;border-collapse:collapse;">.
    Das Andere ist Müll aus Zeiten, als jeder Browser halbwegs seine eigene HTML-Version hatte.

    gruss Kai