[CSS] Wie kann ich abgerundete Tabellen erstellen?

Andreas Gaisbauer · 5. August 2003

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

[CSS] Wie kann ich abgerundete Tabellen erstellen?

Andreas Gaisbauer

Erfahrenes Mitglied

Anhänge

Neue Beiträge