UI font shown as squares

Hey guys,
I have had this problem on many system and can’t seem to figure out why.
In the settings menu and general UI, I get these black squares rather than font.
It can be most seen for example in Writer → Tools → Options → Fonts → Then click on the drop down menu and then the text pertaining to the font selection will become black illegible blocks.
I have tried reinstalling the basic Ubuntu fonts and as well as ttf-deja-vu but nothing works and I’m stumped.
Thank you.

Previously affected Operating Systems (64 Bit):

  1. Linux Mint 17.3 Rosa Cinnamon
  2. Arch Linux (April 2016), KDE Plasma 5 DE
  3. Ubuntu Gnome 16.04 ← Current System

Here is the output of my locale as I suspect it might be because of that.
LANG=en_CA.UTF-8 LANGUAGE=en_CA:en LC_CTYPE="en_CA.UTF-8" LC_NUMERIC="en_CA.UTF-8" LC_TIME="en_CA.UTF-8" LC_COLLATE="en_CA.UTF-8" LC_MONETARY="en_CA.UTF-8" LC_MESSAGES="en_CA.UTF-8" LC_PAPER="en_CA.UTF-8" LC_NAME="en_CA.UTF-8" LC_ADDRESS="en_CA.UTF-8" LC_TELEPHONE="en_CA.UTF-8" LC_MEASUREMENT="en_CA.UTF-8" LC_IDENTIFICATION="en_CA.UTF-8" LC_ALL=

Your version of LibO? Always the same hardware? OpenGL setting?

Sorry about the delay, I thought I would get an e-mail notification.
Latest Version of LibreOffice - 5.
Yes same hardware: [i5 4460, 8 GB ram, R9 280x]
Here is a report on my OpenGL:
Renderer: AMD Radeon R9 200 Series
Vendor: ATI Technologies Inc.
Memory: 3072 MB
Version: 4.4.13431 Core Profile Forward-Compatible Context 16.150.2211.0
Shading language version: 4.50