Solved

Displaying font not installed on client

Posted on 2007-03-26
9
252 Views
Last Modified: 2008-02-20
hi,
is there a way to use ttf file stored in  the website folder?
than you?
0
Comment
Question by:uk1900
[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
  • 4
  • 2
  • 2
  • +1
9 Comments
 
LVL 11

Assisted Solution

by:JamesCssl
JamesCssl earned 500 total points
ID: 18797666
It was possible in CSS/2, but then removed from CSS/2.1.  It is again possible in CSS/3, which isn't yet a recommendation.  Here is how to do it:

<style type="text/css">
@font-face {
    font-family: "Ace Crikey";
    src: url(ace.ttf);
}
.ace {
    font-family: "Ace Crikey";
    font-size: 230%;
}
</style>

It would be prudent to test it in several browsers and see which ones support it.
0
 
LVL 11

Expert Comment

by:JamesCssl
ID: 18797668
0
 
LVL 11

Expert Comment

by:JamesCssl
ID: 18797689
Basically, it's possible using a Microsoft solution that will work in IE only at this point in time.  That should cover about 75% or so of your visitors.
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!

 

Author Comment

by:uk1900
ID: 18798466
hi JamesCssl
I guess I am missing someting with your script,  what is the  Microsoft solution plz?
0
 
LVL 7

Expert Comment

by:Animasu
ID: 18798532
Just to add to what JamesCssl said, There is a way to do this but personally i wouldn't reccomened it, the amount of people using IE are slowly dropping and moving onto something like FF anyways, well... its what ive noticed whether this is for everyone or not i don't know(Depends on the user/site etc...)

I would stick with a font that people have installed allready on your computer and give a choice in your css (font-family: arial, "lucida console", sans-serif;) if the user dosn't have one it looks for the next, and so on. Also you can put off visitors with a random font which you think looks good but other people may thing ''it makes my eyes bleed''

Just keep in the back of your mind 'not everyone will see this font'

Hope this helps

- Animasu
0
 

Author Comment

by:uk1900
ID: 18798681
actualy the script of JamesCssl works with netscape browser but not with IE !
0
 
LVL 11

Accepted Solution

by:
JamesCssl earned 500 total points
ID: 18800802
This is the example from the bottom of the page I referenced.  It requires transforming the ttf font to an eot font using some tools from microsoft.  It does in fact work in IE.

<style type="text/css">
    /* $WEFT -- Created by: francky on 03-09-06 -- */
@font-face {
    font-family: IE_ace;
    font-style: normal;
    font-weight: normal;
    src: url(acekrik0.eot);
}
.ie-ace {
    font-family: IE_ace, "Times New Roman", serif;
    font-size: 230%;
}
</style>
0
 
LVL 9

Expert Comment

by:pmagony
ID: 18802592
If you're using a special font for titles, why not just make them into images?

Or check out some image replacement solutions like:

Gilder/Levin method OR sIFR (Scalable Inman Flash Replacement) @ www.mikindustries.com/sifr

If you're looking to utilize a unique font throughout the entire site (including the body text), I'd recommend shying away from it.

Good Luck-
0
 
LVL 9

Expert Comment

by:pmagony
ID: 18802616
0

Featured Post

Industry Leaders: 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!

Question has a verified solution.

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

Unordered lists (HTML ul tags) are very handy to create menus of all types, shapes and sizes.  All it takes is a little knowledge of CSS and the possibilities are endless. First off, you should know the general format for menus created using the …
CSS3 Custom checkboxes This article shows how to style the checkbox form element using only CSS. Works in: Chrome, FF, Safari, Opera, IE9+ Uses modernizr.js to check for :checked pseudo class, falling back to plain old checkboxes (IE8 and bel…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

687 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