<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Zusammenfallende Zellenränder - Cascading Style Sheets - Workshop Internet-Präsenz</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Language" content="DE" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta name="description" content="Übung Cascading Style Sheets. Zusammenfallende Zellenränder." /> <meta name="keywords" content="HTML, Cascading Style Sheets" /> <meta name="author" content="Roland Unger" /> <style type="text/css"> <!-- table { border: 3px solid #ff0000; border-spacing: 0; } td { border: 3px solid #000; border-spacing: 10px; padding: 0.5em; } .collapse { border-collapse: collapse; } --> </style> </head> <body> <h1>Workshop Internet-Präsenz</h1> <h2>Zusammenfallende Zellenränder - Cascading Style Sheets</h2> <p>Selbst wenn der Zellenabstand Null ist, werden alle Ränder separat dargestellt. Dies ergibt häufig unschöne überbreite oder ungleich breite Ränder.</p> <table summary="Datentabelle" cellspacing="0"> <tbody> <tr> <td>Zelle 11</td> <td>Zelle 12</td> <td>Zelle 13</td> </tr> <tr> <td>Zelle 21</td> <td>Zelle 22</td> <td>Zelle 23</td> </tr> </tbody> </table> <p>Mit der Eigenschaft border-collapse: collapse; kann man alle Ränder zusammenfallen lassen.</p> <table class="collapse" summary="Datentabelle" cellspacing="0"> <tbody> <tr> <td>Zelle 11</td> <td>Zelle 12</td> <td>Zelle 13</td> </tr> <tr> <td>Zelle 21</td> <td>Zelle 22</td> <td>Zelle 23</td> </tr> </tbody> </table> </body> </html>