<!DOCTYPE html> <html> <head> <style type="text/css"> @font-face { font-family: dejavu; src: url(../fonts/dejavu-sans/DejaVuSans.ttf); } p { font-family: dejavu; /* family with only a single weight */ } .test { color: white; /* hide the text, we're only comparing metrics */ } </style> </head> <body> <p>AbcdefghijklmnopqrstuvwxyZ</p> <p>A<span class="test">bcdefghijklmnopqrstuvwxy</span>Z</p> </body> </html>