Guillermo: table durch CSS und div simulierbar?

Hallo,

Häufig wurden ja Tabellen als Gestaltungsmittel benutzt. Stattdessen sollte man ja mit div arbeiten, da Tabellen eigentlich nur für tabellarische Informationen gedacht sind.

Um einen einfachen Umstieg zu haben würde ich statt

<table>
 <tr>
  <td>
  </td>
 </tr>
</table>

gerne einfach nur

<div class="table">
 <div class="tr">
   <div class="td">
   </div>
 </div>
</div>

verwenden wollen, also eine Tabelle im Prinzip simulieren wollen. Die Klassennamen sind hier nur zur Veranschaulichung so gewählt. Geht soetwas überhaupt?

Wenn es geht: Wie muss ich die Klassen table, tr und td im CSS gestalten?

Guillermo

  1. Hallo,

    Wenn es geht: Wie muss ich die Klassen table, tr und td im CSS gestalten?

    display:table, display:table-row, display:table-cell

    http://selfhtml.teamone.de/css/eigenschaften/positionierung.htm#display
    "Die Angaben zu den Tabelleneigenschaften werden von Netscape 6.0 interpretiert, vom Internet Explorer 5.x noch nicht."

    Wenn Dir das egal ist...

    Ansonsten kannst Du immer noch mit float/position u.s.w. rumbasteln.

    Gruesse,

    Thomas

  2. Hallo,

    [...] statt
    <table>
     <tr>
      <td>
      </td>
     </tr>
    </table>

    ^^^^ Das entspricht einer Tabelle mit 1ner Spalte und 1ner Zeile. Sprich eine Zelle.

    [...] einfach nur
    <div class="table">
     <div class="tr">
       <div class="td">
       </div>
     </div>
    </div>

    Um eine Zelle darzustellen benötigst du lediglich 1nen Div-Container.
    Das wollte ich hier nur gesagt haben, um mißverständnissen vorzubeugen.

    Beispiele (Tutorials)

    http://www.css4you.pehlgrim.de/wslayout1/index.php
    http://www.stichpunkt.de/css/bereiche.html
    http://css.fractatulum.net/beispiele.htm
    -> ganz wichtig http://www.selfhtml.net/navigation/css.htm
    -> auch wichtig </archiv/> und nach "css layout" oder "layout ohne tabellen" o.a. suchen ...

    mfg NAG

    --
    signatur
  3. Moin!

    Um einen einfachen Umstieg zu haben würde ich statt

    <table>
     <tr>
      <td>
      </td>
     </tr>
    </table>

    gerne einfach nur

    <div class="table">
     <div class="tr">
       <div class="td">
       </div>
     </div>
    </div>

    verwenden wollen...

    Welchen Sinn macht das? Du verschlechterst deine Seite unnötig, denn Browser, die zwar kein CSS verstehen, aber immerhin Tabellen, kriegen mit deiner neuen Version keine sinnvollen Informationen mehr.

    Vermutlich nimmst du auch die Diskussion um "Tabellen gegen CSS" nicht richtig auf. Es geht keinesfalls darum, dass jetzt alle Tabellen abgeschafft, <table>&Co. nicht mehr verwendet werden und nur noch alles mit <div> und CSS gemacht werden soll.

    Es geht vielmehr darum, _sinnvolle_ HTML-Auszeichnung des Inhalts zu kombinieren mit vernünftiger CSS-Formatierung desselben Inhalts.

    Echte Tabellen haben nach wie vor ihre uneingeschränkte Existenzberechtigung. Es ist nämlich leider so, dass in Tabellenzellen andere (mehr) Textausrichtungsmöglichkeiten existieren, als außerhalb. Und natürlich: Tabellarische Informationen gehören natürlich in Tabellen.

    Du solltest dich, um das Tabellenlayout gegen ein CSS-gesteuertes Layout einzutauschen, gedanklich vollkommen von Tabellenformen verabschieden. Es ist eine durchaus nicht einfache gedankliche Umstellung damit verbunden. Die technische Umsetzung dagegen ist dann verhältnismäßig einfach.

    - Sven Rautenberg

    --
    ss:) zu:) ls:[ fo:} de:] va:) ch:] sh:) n4:# rl:| br:< js:| ie:( fl:( mo:|
  4. Hallo,

    Häufig wurden ja Tabellen als Gestaltungsmittel benutzt. Stattdessen sollte man ja mit div arbeiten, da Tabellen eigentlich nur für tabellarische Informationen gedacht sind.

    Das ist nur bedingt richtig.

    Um einen einfachen Umstieg zu haben würde ich statt

    <table>
     <tr>
      <td>
      </td>
     </tr>
    </table>

    gerne einfach nur

    <div class="table">
     <div class="tr">
       <div class="td">
       </div>
     </div>
    </div>

    verwenden wollen, also eine Tabelle im Prinzip simulieren wollen.

    Sag mal, bist du ein Troll? Das kannst du doch nicht wirklich ernst meinen, oder?

    Bitte lies http://forum.de.selfhtml.org/archiv/2003/4/44257/#m241426. Solltest du damit nicht weiter kommen, poste ein konkretes Beispiel, anhand dessen ich dir erklären kann, wie du ein gewünschtes Layout ohne Tabellen umsetzen kannst.

    Gruß,

    MI

    --
    XFrames Working Draft (Deutsche Übersetzung) : http://jendryschik.de/TR/xframes/
    Die Wissensgesellschaft : http://jendryschik.de/michael/inf/wissensgesellschaft/
    Einführung in XHTML, CSS und Webdesign: http://jendryschik.de/wsdev/einfuehrung/
    Feste Positionierung, richtig angewandt : http://jendryschik.de/wsdev/css/fixed/
    sh:( fo:) rl:( br:& br:] ' n4:& | n4:? ' ie:| va:) de:] zu:) fl:{ ss:| ls:& js:|
  5. <div class="table">
     <div class="tr">
       <div class="td">
       </div>
     </div>
    </div>

    Da ist ja dann eigentlich kein Unterschied zur Tabelle.
    Was also bringt es? Nix.

    Nutze Tabellen weiterhin wo es Sinn ergibt, wenn CSS&Co keine zufriedenstellende Lösung bringen auch gern zum Layout.

    Wenn du allerdings genau das gleiche auch mit "float" und ähnlichem erreichen kannst, dann ist das vorzuziehen.

    sh:( fo:| ch:? rl:( br:$ n4:° ie:| mo:) va:) de:[ zu:) fl:( ss:| ls:[ js:(