Autom. Abstand zwischen einer Tabelle in einer Tabelle

[Nils_13]

Hi,

ich muss eine Tabelle in eine andere packen. Dabei gibt es nun die Unschönheit, dass ich einen automatischen Abstand zwischen der ersten und der zweiten Tabelle habe. Wie könnte man das beseitigen ? Der obere Teil des Screenshots zeigt es aktuell und der untere, wie es erwünscht ist. Hier der Code:

Code:

<table cellspacing="0" class="table" style="border-spacing:'0px'">
  <thead>
    <tr>
      <td>
        <table cellspacing="0" class="table">
          <th>[url="proj.php"]Projekte[/url]</th>
          <th>&gt;</th>
          <?php
            if ($_GET["titel"]=="")
              echo "<th style='width:100%'></th>";
            else
              echo "<th>[url='proj.php?titel=".$_GET["titel"]."']" . $_GET["titel"] . "[/url]";
         ?>
        </table>
      </td>
    </tr>
  </thead>
</table>

[Die Muhkuh]

cellspacing="0" cellpadding="0"

[Nils_13]

Bei beiden Tabellen ? Hat bei mir nichts verändert.

[mkinzler]

Wie ist den die css-Klasse definiert?

[Nils_13]

Code:

table.table
{
  float           : middle;
  width           : 50%;
  border-spacing  : 0px;
  border-collapse : collapse;
  background      : #F7D6A8;
  border          : 1px solid #ED9F35;
  border-top      : 0px solid #000000;
  font-size       : 99%;
}

table.table th
{
  text-align   : left;
  font-weight  : normal;
  padding      : 0.1em 0.5em;
  border-left  : 1px solid #C65A22;
  border-top   : 1px solid #C65A22;
  border-right : 1px solid #C65A22;
}

table.table td
{
  text-align    : left;
  border-left   : 1px solid #ED9F35;
  padding       : 0.1em 0.5em;
}

table.table td.top
{
  text-align : left;
  border     : 0px solid #ED9F35;
  border-top : 1px solid #ED9F35;
  padding    : 0.1em 0.5em;
}

table.table td.left
{
  text-align  : left;
  border-left : 0px solid #ED9F35;
  padding     : 0.1em 0.5em;
}

table.table thead th
{
  text-align       : center;
  font-weight      : bold;
  background-color : #EB941D;
  color            : #FCEEDC;
}

table.table th.corner
{
  text-align : left;
}

table.table tr.odd
{
  background : #FCEEDC;
}

[Thorben77]

Das sieht mir doch stark nach Tabellendesign aus *igitt*

Du hast für Tabellenzellen einen Innenabstand (padding) festgelegt, deshalb der „automatische Abstand“.

Code:

table.table td {
  padding: 0.1em 0.5em;
}

Setz ihn für die Zelle, in der sich die innere Tabelle befindet, auf 0 und dein Problem dürfte gelöst sein.

Wozu ist die überhaupt äußere Tabelle? Sie hat keine gesonderten Formatierungen, also müsstest du sie problemlos weglassen können. Notfalls kannst du sie auch durch ein div-Element ersetzen, das braucht wesentlich weniger Platz im Quelltext, als die ganzen table-, tr-, und td-Elemente.

Und was ist eigentlich float: middle?

[Nils_13]

Das hat damit nichts zutun. Habe es gerade rausgenommen, aber es hat nur bei allen anderen Seitenbestandteilen etwas verändert, aber (wie immer!) hier wieder nicht.

Die äußere Tabelle hat einen Sinn: Wenn du eine Tabelle mit 3 <th>s hast, die ersten beiden davon die Breite des Textes und das letzte den REST (nicht 100%!) haben sollen, wirst du mit einer Tabelle an deine Grenzen stoßen: Setzt du die Breite des letzten <th>s auf 100%, werden die beiden davor zerquetscht, lässt du es weg, schiebt sich alles hässlich auf.

Schau dir mal den Quelltext von irgendeinem Thread der DP an und du verstehst denke ich, was ich meine. Wie willst du denn Auflistungen mit <div>s machen ? Tabellen sind fester Bestandteil von HTML. Wer sie benutzen will kann sie benutzen.

Auf meiner Liste steht, dass ich die style.css noch aufräumen muss. Solche Sachen zählen dazu.

[Thorben77]

Zitat von Nils_13:

Das hat damit nichts zutun. Habe es gerade rausgenommen, aber es hat nur bei allen anderen Seitenbestandteilen etwas verändert, aber (wie immer!) hier wieder nicht.

Nach den Schnipseln, die du gepostet hast, ist das padding dein Problem.

Kannst du das Ganze vielleicht irgendwo hochladen? Dann lässt es sich leichter problemlösen.

Zitat von Nils_13:

Die äußere Tabelle hat einen Sinn: Wenn du eine Tabelle mit 3 <th>s hast, die ersten beiden davon die Breite des Textes und das letzte den REST (nicht 100%!) haben sollen, wirst du mit einer Tabelle an deine Grenzen stoßen: Setzt du die Breite des letzten &lt;th&gt;s auf 100%, werden die beiden davor zerquetscht, lässt du es weg, schiebt sich alles hässlich auf.

Wenn ich dich richtig verstanden habe, müsste das auch ohne die äußere Tabelle gehen.

Zitat von Nils_13:

Wie willst du denn Auflistungen mit <div> machen ?

Gar nicht. Dazu nehme ich unsortierte und sortierte Listen oder auch Definitionslisten.

Zitat von Nils_13:

Tabellen sind fester Bestandteil von HTML. Wer sie benutzen will kann sie benutzen.

Im Idealfall sollte man sie für tabellarische Daten benutzen, nicht für bloße Gestaltung.