Tabellen beter opmaken in het cms

Weblogbericht | 19-05-2020 | DPC Online Advies

Bovenstaand voorbeeld is een typische tabel die er veel beter uit zou kunnen zien als je meer controle had over waar de browser teksten af mag breken. Browsers kunnen teksten in principe afbreken op elke spatie of koppelteken om te zorgen dat een tekst of tabel in de breedte op je scherm past en dat doen ze vrij willekeurig.

Er bestaan echter speciale spaties en koppeltekens die een browser niet af mag breken en waardoor je daar dus invloed op hebt. Als je in dit voorbeeld zo'n spatie in de kopteksten gebruikt tussen onder andere "20" en "jaar" kun je er onderstaande tabel van maken. Dat ziet er meteen een stuk strakker uit.

We hebben het mogelijk gemaakt om deze zogenaamde non-breaking spaces en non-breaking hyphens (koppeltekens) in te voeren in de tekstverwerker van het cms. Die kun je indien nodig gebruiken in plaats van reguliere spaties en koppeltekens. Je vindt ze onder de omega-knop van de tekstverwerker als de twee laatste karakters.

De non-breaking hyphens zijn bijvoorbeeld ook goed te gebruiken als je datums niet wil laten afbreken op hun koppeltekens.

Let wel op dat je browsers wel ruimte laat om nog ergens op af te breken, want anders loopt je tabel rechts uit beeld en moeten bezoekers wellicht onnodig horizontaal scrollen om alles te kunnen lezen.

Vergroot afbeelding

De non-breaking hyphens zijn bijvoorbeeld ook goed te gebruiken als je datums niet wil laten afbreken op hun koppeltekens.

Let wel op dat je browsers wel ruimte laat om nog ergens op af te breken, want anders loopt je tabel rechts uit beeld en moeten bezoekers wellicht onnodig horizontaal scrollen om alles te kunnen lezen.