Error when using custom fonts in css

Question

While I was trying to use a custom font for my site through a CSS file, I am not getting the required font and it only shows the default font. Please check the css code and let me know if any changes are needed :)

@font-face { font-family: Myriad Pro; src: url('Myriad.ttf'); } #voicetext{ color:#127bb9; font-size:16px; font-family:"Myriad Pro"; text-align:center; letter-spacing:3px; } 

Answer 1

Unfortunately, this is not as straightforward as this. For a truly cross-browser solution, you will need to refer not only to the TTF version.

This question: How to embed fonts in HTML? has a complete list and links to Paul Irish's “Bulletproof Web Fonts” blog that fits all browser features.

If you're in a hurry and not interested in specifics, the FontSquirrel Bulletproof @ font-face generator seems to use the hints from the blog post.

Answer 2

My first guess is probably that you downloaded the font file in the wrong place. You will currently need the Myriad.ttf file in the same directory as your css file.