[CSS] Wie kann ich abgerundete Tabellen erstellen?

Status
Nicht offen für weitere Antworten.

Andreas Gaisbauer

Erfahrenes Mitglied
Wie kann ich abgerundete Tabellen erstellen?

Bis jetzt musst man leider noch auf Images zurückgreifen.
PHP:
<table cellpadding="0" cellspacing="0" border="0">
    <tr>
        <td><img src="links_oben.jpg"></td>
        <td></td>
        <td><img src="rechts_oben.jpg"></td>
    </tr>
    <tr>
        <td></td>
        <td> Inhalt </td>
        <td></td>
    </tr>
    <tr>
        <td><img src="links_unten.jpg"></td>
        <td></td>
        <td><img src="rechts_unten.jpg"></td>
    </tr>
</table>

In Gecko Browsern kann man auf das Mozilla CSS-Attribut "MozBorderRadius" zurückgreifen.
PHP:
<style type="text/css">
<!--
table {
      background-color: #000;
      text-align: left;
      border: 1px solid #000;
      color:#fff;
      -moz-border-radius-bottomleft: 50px;
      -moz-border-radius-bottomright: 50px;
      -moz-border-radius-topleft: 50px;
      -moz-border-radius-topright: 50px;
}
-->
</style>

Ausblick: In CSS3 wird es auch möglich sein, abgerundete Tabellen zu erstellen.

Links:
Mozilla CSS Spezifikation: http://devedge.netscape.com/library/xref/2002/client-data/property-data-style.html
CSS3 Radius Spezifikation: http://www.w3.org/TR/2002/WD-css3-border-20021107/#the-border-radius
 

Anhänge

  • rundetabellen.zip
    12,4 KB · Aufrufe: 309
Status
Nicht offen für weitere Antworten.
Zurück