Zur Navigation

Tabellen: cellpadding und cellspacing durch css ersetzen

1 six

W3C Validator meldet das unter Html 5 die Tabellenangaben in der Form nicht erlaubt sind und sollte durch css ersetzt werden:

<table width="100%" cellpadding="0" cellspacing="1" border="0">

Aus..
<table width="100%" cellpadding="0" cellspacing="1" class="tabinhalt">
  <tr>
    <td colspan="4" class="unterstr">Kinderschnitt</td>
  </tr>
  <tr>
    <td width="32%" class="marlinks">0 - 10 Jahre</td>
    <td width="18%">14&euro;</td>
    <td width="18%">&nbsp;</td>
    <td width="32%">&nbsp;</td>
  </tr>

Wurde..
<table class="tabinhalt">
  <tr>
    <td colspan="4" class="unterstr">Kinderschnitt</td>
  </tr>
  <tr>
    <td style="width:32%" class="marlinks">0 - 10 Jahre</td>
    <td style="width:18%">14&euro;</td>
    <td style="width:18%">&nbsp;</td>
    <td style="width:32%">&nbsp;</td>
  </tr>
----css----
.tabinhalt{
font-family:"Trebuchet MS", Verdana;
font-size:15px;color:#2D636A;line-height:17px;
width:100%;margin-top:15px;border-width:0}

Border und width sind jetzt in der css angegeben, aber cellpadding und cellspacing lassen sich in der css so nicht einbinden!
Gut W3C meldet jetzt kein Fehler mehr, aber richtig kann es auch nicht sein,
screenslicer haben wohl ein Problem damit.

Wer hat eine Idee?

19.03.2017 10:58 | geändert: 19.03.2017 11:01

2 Jörg Kruse

cellspacing kann man durch die CSS-Eigenschaft border-spacing ersetzen. Wenn der Abstand gleich 0, sollte zudem für border-collapse der Wert collapse gesetzt werden, ansonsten separate

.tabinhalt {
  border-collapse: collapse;
  border-spacing: 0;
}

oder

.tabinhalt {
  border-collapse: separate;
  border-spacing: 1px;
}

Als CSS-Ersatz für cellpadding definiert man padding für die in der Tabelle enthaltenen Tabellenzellen:

.tabinhalt td {
  padding: 0;
}

19.03.2017 13:04 | geändert: 19.03.2017 13:06

Beitrag schreiben (als Gast)

Die Antwort wird nach der Überprüfung durch einen Moderator freigeschaltet.





[BBCode-Hilfe]