KNOWLEDGE BASE

Text Appears Misaligned in Browser When Using Non-Websafe Fonts


Published: 16 Aug 2017
Last Modified Date: 17 Aug 2017

Issue

When formatting text with non-websafe fonts on a dashboard to be centered, the text appears off-center or oddly aligned in the browser, even when the same font is installed on the client machines.

Environment

  • Tableau Server
  • Non-websafe fonts

Resolution

Option 1:

Try using a web safe font as these are commonly found on most operating systems. If the font you are using is web safe, but the issue is still occurring, confirm that the font is installed on all machines, as it may for some reason have been removed or corrupted.

Option 2:

Install the desired font on all client machines and the machine (or machines) hosting Tableau Server.

Cause

When Tableau Server does not have the specific font installed, it handles the sizing by using a fall-back default font, while it continues to send spacing information to the browser about the original font. This confusing behavior may lead to displays that are not working as intended.

Additional Information

Non-web safe fonts are those that may not be installed on all desktop and server machines by default. An example of a non-websafe font is Arial Narrow. However, Arial is considered web safe because you can be reasonably certain it is installed everywhere.
Did this article resolve the issue?