FONT not displaying certain characters

I am using a custom font on the website i'm developing and some basic characters are not being displayed. What seems to be the problem?

Also i am fetching the content from MYSQL.

Is the font bad?

@font-face {font-family: Cabin_Regular; src: url('fonts/Cabin_Regular.ttf');}
@font-face {font-family: Lobster; src: url('fonts/Lobster.ttf');}
body, select, input, textarea {font-family: 'Cabin_Regular';color:white;font-size: 16px;text-shadow: 0.1em 0.1em 0.2em black;}
h1, h2, h3, h4, h5, h6 {font-family: 'Lobster'; margin-bottom: 0;padding-bottom: 0;margin-top: 0; padding-top: 0;}


Check the encoding in your MySQL database. If it's not UTF-8 you're going to have issues

if it isn't UTF-8 use the following after you've connected to the database and are about to execute a Query


Also make sure you have the charset defined in the <head> of your html document

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

... I actually ran into this problem myself once when using a client's database which was set to Latin1. A real pain to figure out the first time.

First check if the characters are encoded for example the copyright symbol should be &copy; in the database.

Second check if the font even supports the character some fonts don't have all of the glyphs you want. What are the characters suppose to be?

This is almost certainly an encoding issue. See for some solutions.

To clarify, everything (PHP, MySQL, and even their conneciton to eachother) needs to be communicating in the same encoding or the same entities will be rendered differently. The standard is utf-8, but the important issue isn't really which is used but that it is used uniformly. There are good suggestions on how to get everything on the same page in the above link.

Need Your Help

How to Shrink/Cut a Git Repo

git branch

We have a Git repo with 7 contributing developers with over 2.5 years of history and about 10,000 commits. We use Assembla to push and pull from. When we add new developers cloning the repo to thei...

ExtJs 4.1 grid's grouping feature enabling and disabling issue

javascript extjs extjs4.1 extjs-grid extjs-stores

I am using ExtJs 4.1. My application is having two grid. Both the grid have grouping feature (I am using two unique Grouping feature). Both the grids are using single store. Each grid is having two