Cet exemple rend compte d'une différence entre le modèle de la table de CSS pour HTML et d'autres formats de document. Le premier exemple, en HTML, est considéré non valide, car il conduirait au chevauchement des cellules si les règles HTML de disposition étaient suivies. Les règles CSS s'appliquent à d'autres formats que HTML et ne présentent pas ce problème.
Ce dessin dépeint comment les deux exemples, celui en HTML et l'autre presque identique non-HTML, pourraient être rendus. Le rendu de l'exemple HTML n'est pas défini, l'un des rendus possibles est représenté ici dans la moitié gauche de l'image : il y a deux cellules qui se chevauchent. Le rendu de l'exemple non-HTML est dans la moitié droite, il suit les règles CSS et ainsi les cellules ne se chevauchent pas.
In both tables, cells have gray backgrounds and a black border. Each contains a single digit as label. Cells are separated from each other by cell spacing.
La table de gauche a une rangée supérieure avec quatre cellules qui ont respectivement les numéros "1", "2", "3" et "4". La deuxième cellule, numérotée "2", s'étend dans la rangée du dessous. La seconde rangée de la table contient une seule cellule, numérotée "5", et s'étend sur les colonnes un et deux. Ainsi, la cellule "2" et la cellule "5" se chevauchent dans la seconde rangée et seconde colonne. Ce chevauchement est représenté par un fond de couleur gris plus foncé.
La table de droite a une même rangée de quatre cellules, numérotées "1", "2", "3" et "4". La deuxième cellule s'étend aussi sur la deuxième rangée. La seconde rangée de la table contient une cellule, numérotée "5", qui s'étend sur les colonnes trois et quatre. Ainsi, aucune cellule ne se chevauche, la première cellule de la seconde rangée reste vide.