Yep, een strijd in de codeer wereld. Gebruiken we EM of PX simpele
oplossing, gebruik gewoon procenten dan heb je heel de discussie niet. Echter
is dat niet de oplossing. Wat is het grote verschil nou eigenlijk tussen pixels
en ems? Pixels zijn totaal niet responsive. Als je een responsive website wilt
maken, gebruik dan zeker EM!
Pixels zijn vaste waardes, 10 pixels is
dus 10 pixels. Bij een em is dat anders. De basiswaarde van een em is
gerelateerd aan de lettergrootte. Deze lettergrootte is voor desktop browsers
standaard 16 pixels. Door de body een font-size van 100% te geven is 1 em dus
gelijk aan 16 pixels. Voor mobiele browsers kan de waarde van het standaard
lettergrootte verschillend zijn. Dit is omdat een telefoon verschillende groottes
heeft. Een grote mobiel heeft hoogst waarschijnlijk ook een groter lettertype.
Hoe komen we eigenlijk aan ems?
Oorspronkelijk komen de ems uit de
printindustrie. Ems houdt in hoeveel horizontale ruimte er is. Als een
lettertype 3pt is dan is de standaardwaarde van 1em 3pt. Als een lettertype
90pt is dan is de standaard waarde van 1em 90pt.
Kleine hulp met rekenen.
Met een font-size van 100% is 1.5em gelijk aan 16 x 1.5 = 24 pixels.
Andersom kan uiteraard ook; 0.75 em is gelijk aan 0.75 x 16 = 12 pixel.
