Uitgebreide omschrijving voor een voorbeeld dat toont hoe structureel overlappende cellen weergegeven worden

Dit voorbeeld toont een verschil tussen het tabel model voor CSS voor HTML en voor andere document formaten. Het eerste, HTML, voorbeeld wordt door HTML als niet geldig gedefinieerd omdat het tot overlappende cellen zou leiden omdat de regels van HTML voor layout gevolgd worden. De CSS regels gelden op andere formaten dan HTML en hebben dit probleem niet.

De figuur geeft weer hoe twee voorbeelden, het HTML voorbeeld en het bijna identieke niet-HTML voorbeeld, weergegeven kunnen worden. De weergave van het HTML voorbeeld is niet gedefinieerd en de mogelijke weergave wordt hier getoond in de linkerkant van de figuur: het heeft twee cellen die overlappen. De weergave van het niet-HTML voorbeeld wordt rechts weergegeven, het volgt de CSS regels en heeft dus geen overlappende cellen.

In beide tabellen hebben cellen grijze achtergronden en een zwarte rand. Elk bevat een getal als label. Cellen worden van elkaar gescheiden dor celopvulling.

De linker tabel heeft een top rij van vier cellen, die respectievelijk de getallen "1", "2", "3" en "4" bevat. De tweede van deze cellen, degene met het getal "2" erin, reikt tot de rij eronder. De tweede rij van de tabel bevat één cel, welke het getal "5" bevat en welke kolom één en twee overspant. Cel "2" en cel "5" overlappen dus in de tweede rij, tweede kolom. De overlapping wordt afgebeeld door een donkerdere grijze achtergrond.

De rechtertabel heeft dezelfde top rij van vier cellen, genoemd "1", "2", "3" en "4". De tweede cel overspant opnieuw de rijen één en twee. De tweede rij van de tabel bevat één cel, die het getal "5" bevat en welke kolom drie en vier overspant. Er overlappen dus geen cellen, maar de eerste cel van de tweede rij is leeg gelaten.

Terug naar figuur.