Solved

Font Face

Posted on 2010-11-18
10
865 Views
Last Modified: 2012-06-21
Hey guys, i have a problem, i am pulling fonts from the sever, here is my code:

@font-face
{
 font-family: 'MyCustomFont';
 src: url('../Fonts/calibri-webfont.eot');
 src: local('Calibri'), local('Calibri'), url('../Fonts/calibri-webfont.woff') format('woff'), url('../Fonts/calibri-webfont.ttf') format('truetype'), url('../Fonts/calibri-webfont.svg#webfonthsJxRxCf') format('svg');
}

the problem is that the fonts look different in firefox and IE? why?
can any one help me and show me how to use font face to pull fonts and dislpay it in different browser?

In FireFox and google Chrome the smaller fonts seems to be gramed up, but i did use :

font-size-adjust: 0.47;

but it does not seem to look right, can someone please help me so i can display to fonts in all browser the same?
0
Comment
Question by:JCWEBHOST
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
10 Comments
 
LVL 16

Expert Comment

by:Vikram Singh Saini
ID: 34171039
End user make their browser's font and size set according to their preference. So in your case that could be hurdle.
0
 
LVL 3

Expert Comment

by:boraganesh
ID: 34171077
Yes there is some diffrence in rendering fonts in Mozzila and IE

As compare to IE mozzila shows blured fonts. but no need to worry about it as its a browser issue
0
 

Author Comment

by:JCWEBHOST
ID: 34171550
but how do i fix that blured fonts?
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 3

Expert Comment

by:boraganesh
ID: 34171578
no.its not under our control...its browsers issue. same like OS windows and linux..
linux shows nice fonts as compared to windows.
0
 
LVL 29

Expert Comment

by:Badotz
ID: 34173287
>>linux shows nice fonts as compared to windows.

What in the world does that mean?
0
 
LVL 29

Expert Comment

by:Badotz
ID: 34173319
boraganesh: While we're at it, you state:

"As compare to IE mozzila shows blured fonts. but no need to worry about it as its a browser issue" (sic)

Upon what is this based?
0
 
LVL 6

Expert Comment

by:kmead6
ID: 34174439
You could try calling a different style for Mozilla by including in your <head> tags:
<style type="text/css">
            @-moz-document url-prefix() {
                p {
                        font-size-adjust: 1;
                  }
            }
</style>

or whatever needs to be adjusted since we don't have a link or any other html/css to go off of. A link is always helpful to be able to see the problem.
0
 
LVL 44

Accepted Solution

by:
scrathcyboy earned 500 total points
ID: 34178064
"can someone please help me so i can display to fonts in all browser the same?"

The only way I know of getting all browsers to render a font identically is to use the STANDARD fonts that are installed in these OSs, like --

ARIAL, TAHOMA, VERDANA, Times New Roman -- etc.

Those are the standards for all browsers.  When you pull fonts from a server with encoding that may not match what the browser on a particular OS interprets the encoding to be, you will get bad font rendering, and each browser rendering it differently.  Hence you are stuck with the standard ones.
0
 
LVL 3

Expert Comment

by:boraganesh
ID: 34178892
yes..right scrathcyboy:

we have no options otherwise stucking with browsers standards..:)
0
 
LVL 29

Expert Comment

by:Badotz
ID: 34179339
boraganesh: You have not answered my questions...
0

Featured Post

Online Training Solution

Drastically shorten your training time with WalkMe's advanced online training solution that Guides your trainees to action. Forget about retraining and skyrocket knowledge retention rates.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

SSL stands for “Secure Sockets Layer” and an SSL certificate is a critical component to keeping your website safe, secured, and compliant. Any ecommerce website must have an SSL certificate to ensure the safe handling of sensitive information like…
In threads here at EE, each comment has a unique Identifier (ID). It is easy to get the full path for an ID via the right-click context menu. However, we often want to post a short link within a thread rather than the full link. This article shows a…
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…

739 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question