Member Avatar for PChuprina

Hello all,

To my dismay i discovered my @font-face font is not working on the Safari mobile browser. I downloaded the font package from Fontsquirrel and yes it does have the font in its svg version. Here is the CSScode:

/* Generated by Font Squirrel ([url]http://www.fontsquirrel.com[/url]) on April 20, 2010 05:06:32 PM America/New_York */
@font-face {
    font-family: 'ChopinScriptRegular';
    src: url('../fonts/ChopinScript-webfont.eot');
    src: local('☺'), url('../fonts/ChopinScript-webfont.woff') format('woff'), url('../fonts/ChopinScript-webfont.ttf') format('truetype'), url('ChopinScript-webfont.svg#webfont3FgKTvnt') format('svg');
    font-weight: normal;
    font-style: normal;
}
 
div#navbar ul {
    /*border:  solid red 1px;*/
    width:  720px;
    margin: 0px auto;
    padding: 0px;
    font-family: ChopinScriptRegular, Arial, Helvetica;
    font-size:  170%;
    color: #2a0050;
    line-height: 37px;
    white-space: nowrap;
}

Have I missed something? Does Safari mobile have a issue with the font-height being in"%?"

  • 4 Contributors
  • 6 Replies
  • 622 Views
  • 3 Weeks Discussion Span
  • Latest Post Latest Post by ingeva
Member Avatar for Dani

I believe that's what his complaint is. That it works fine on desktops but not on mobile browsers.

Member Avatar for PChuprina

@cscgal Thank you, you are right, that is my concern. It does not work on the Safari mobile browser for the Ipad and Iphone. I also have the issue of not having access to a Iphone or Ipad to test except at a Apple store......

Member Avatar for Dani

I have an iPad but unfortunately I left it in my car today. I'll try to remember to check when I leave work.

Member Avatar for PChuprina

left it in your car? Oh my.....

I'm going to set up a test site with this particular code tomorrow am. Can i give you the adress tomorrow? Been a frustrating day.

Thanks for all your help

Patrick Chuprina

Member Avatar for ingeva

I'm trying this code because Windows systems do not
have these fonts:

CSS file:

@font-face {
	font-family: Ubuntu-Title;
	src: url (/c/fonts/Ubuntu-Title.ttf);
}
and
.logotext {
	float:left;
	color:#00b030;
	font-size:120%;
	font-weight:bold;
	line-height:1;
	padding:1.5em 0 0 1em;
	font-family:Ubuntu-Title, LMSansQuotation8, Tahoma, Arial, sans-serif;
	text-shadow:.06em .06em .06em #050;
}

The LMSans.... font is used, the Ubuntu font is ignored.
I have even installed the Ubuntu font, but I'm
not 100% sure it works for Apache. It works for Write.

I'm running Ubuntu 9.10 with LAMP server and FireFox 3.6.12.
It's the same in Safari and Opera (Well, very little works
with Opera, so we can forget that anyway! :) )

(NOT tried from Windows yet, because then I have to upload it
to the web server and it's not ready for that yet).

I have tried with and without quotes around the filename.
No difference. The path is correct.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.