W’s get cut off in HTML

OK heres a problem few of us run into, but if you happen to im going to save you a lot of time. It came up in a recent project. The client complained that any capital “W” that started a line of text was missing its leftmost upper corner. If you pay attention, you will see this on tons of websites. Its a problem SPECIFIC to Arial font, sizes 11 and under.

The fix is very simple: add a 1px padding-left to your CSS class for the font. Thats it. W’s regain their composure, and can continue being the biggest letter in the whole alphabet.

Or, you can simply tell your client not to start lines with capital W’s.

Geek on.

-John

Leave a Reply