Ergebnis 1 bis 4 von 4
  1. #1
    carieleido ist offline Eroberer
    registriert
    20-03-2009
    Beiträge
    62

    CSS3 Tabelle mit Display Table und Table-Cell

    Viele Webseiten und Webmaster nutzen immer noch das veraltete Table-Tag. Es sollte darauf aufmerksam gemacht werden, dass alle aktuellen Browser (und dazu gehört der IE7 nicht) die neuen CSS3-Tags unterstützen. Für alle, die "Display Table" noch nicht kennen oder Probleme damit haben: Hier ist eine Vorlage für eine CSS3 Tabelle mit Display Table und Table-Cell.

    HTML-Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html><head>
    <title>HTML Div-Table</title>
    <style type="text/css">
    
    body{
    margin:8px;
    padding:0px;
    }
    
    .bold{font-weight:bold;}
    
    .cell1, .cell2{
    display:table-cell;
    border-color:#000000;
    border-style:solid;
    padding:15px;
    width:33%;
    }
    
    .cell1{border-width:0px 1px 1px 1px;}
    
    .cell2{border-width:0px 1px 1px 0px;}
    
    .row{
    display:table-row;
    width:100%;
    }
    
    .table{
    border-color:#000000;
    border-style:solid;
    border-width:1px 0px 0px 0px;
    display:table;
    width:100%;
    }
    
    </style>
    </head><body>
    
    <div class="table"><div class="row">
    
    <div class="cell1">
    <a class="bold">Thema 1.1</a><br><br>
    Zeile 1: Dies ist der erste Inhalt<br>
    Zeile 2: Hier kommt ein ganz anderer Inhalt<br>
    </div>
    
    <div class="cell2">
    <a class="bold">Thema 2.1</a><br><br>
    Zeile 1: Dies ist der erste Inhalt<br>
    Zeile 2: Hier kommt ein ganz anderer Inhalt<br>
    </div>
    
    <div class="cell2">
    <a class="bold">Thema 3.1</a><br><br>
    Zeile 1: Dies ist der erste Inhalt<br>
    Zeile 2: Hier kommt ein ganz anderer Inhalt<br>
    </div>
    
    </div><div class="row">
    
    <div class="cell1">
    <a class="bold">Thema 1.2</a><br><br>
    Zeile 1: Dies ist der erste Inhalt<br>
    Zeile 2: Hier kommt ein ganz anderer Inhalt<br>
    </div>
    
    <div class="cell2">
    <a class="bold">Thema 2.2</a><br><br>
    Zeile 1: Dies ist der erste Inhalt<br>
    Zeile 2: Hier kommt ein ganz anderer Inhalt<br>
    </div>
    
    <div class="cell2">
    <a class="bold">Thema 3.2</a><br><br>
    Zeile 1: Dies ist der erste Inhalt<br>
    Zeile 2: Hier kommt ein ganz anderer Inhalt<br>
    </div>
    
    </div><div class="row">
    
    <div class="cell1">
    <a class="bold">Thema 1.3</a><br><br>
    Zeile 1: Dies ist der erste Inhalt<br>
    Zeile 2: Hier kommt ein ganz anderer Inhalt<br>
    </div>
    
    <div class="cell2">
    <a class="bold">Thema 2.3</a><br><br>
    Zeile 1: Dies ist der erste Inhalt<br>
    Zeile 2: Hier kommt ein ganz anderer Inhalt<br>
    </div>
    
    <div class="cell2">
    <a class="bold">Thema 3.3</a><br><br>
    Zeile 1: Dies ist der erste Inhalt<br>
    Zeile 2: Hier kommt ein ganz anderer Inhalt<br>
    </div>
    
    </div></div>
    
    </body></html>

  2. #2
    Avatar von Arcsinh
    Arcsinh ist offline Kaiser
    registriert
    03-06-2010
    Beiträge
    1.392

    AW: CSS3 Tabelle mit Display Table und Table-Cell

    Ich denke mal, wenn man wirklich ne Tabelle machen will, kann man den table-Tag benutzen.
    Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Goethe)

  3. #3
    ein schlauer ist offline Lounge-Member
    registriert
    18-08-2004
    Beiträge
    14.671

    AW: CSS3 Tabelle mit Display Table und Table-Cell

    Sehe ich genau so. Das Table Tag ist absolut nicht veraltet, diese Aussage ist Quatsch.

  4. #4
    Avatar von David10
    David10 ist offline Grünschnabel
    registriert
    12-12-2009
    Beiträge
    4

    AW: CSS3 Tabelle mit Display Table und Table-Cell

    /edit

    sorry das Thema ist ja uralt !
    Geändert von David10 (15-09-2011 um 22:53 Uhr) Grund: Datum übersehen

Ähnliche Themen

  1. Table
    Von bandido1 im Forum JavaScript
    Antworten: 0
    Letzter Beitrag: 22-08-2009, 15:03
  2. display: table in IE
    Von j_jara im Forum CSS und (X)HTML
    Antworten: 2
    Letzter Beitrag: 28-04-2009, 20:39
  3. table table table tr tr td td td {...}
    Von hinkel11 im Forum CSS und (X)HTML
    Antworten: 2
    Letzter Beitrag: 10-03-2009, 23:56
  4. Tabelle in MySQL-Table?
    Von Superotto im Forum JavaScript
    Antworten: 9
    Letzter Beitrag: 13-01-2009, 01:19
  5. table
    Von RobertN im Forum Allgemeines
    Antworten: 5
    Letzter Beitrag: 29-03-2002, 23:40

Stichworte

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •