Rockwell Font On Desktop And Mobile Devices?

[MSUK1]

Hi there, im wondering how via css and html to get the font "rockwell" on mobile and desktop devices.

 

I at first used:

 

font-family:rockwell;

 

this worked on my desktop but not my iphone?

 

i can see a site www.just-eat.co.uk using this:

 

font-family:"RockwellRegular",Arial,Helvetica,sans-serif;

 

so i thought i'd try this straight copy and paste, but then i only get the arial font?

[trq]

Fonts need to be installed on the client in order for the browser to use them.

[MSUK1]

by client do you mean devide being used to view website?

 

If so, the font i am looking for is installed on both mac, windows and iphone.

 

Like i said i visited just-eat.com and there font works on my iphone? However using their same code, does not work on my iphone?

 

If you mean installing on my server how do i do this?

[DarkerAngel]

Fonts need to be installed on the client in order for the browser to use them.

You might need to do a little bit of homework, web fonts are starting to grow fast, and with some CSS tricks (and a compatible browser [iOS / Android included]) You can use whichever font you wish in your HTML.

Hi there, im wondering how via css and html to get the font "rockwell" on mobile and desktop devices.

 

I at first used:

 

font-family:rockwell;

 

this worked on my desktop but not my iphone?

 

i can see a site www.just-eat.co.uk using this:

 

font-family:"RockwellRegular",Arial,Helvetica,sans-serif;

 

so i thought i'd try this straight copy and paste, but then i only get the arial font?

 

What you need to do is make a server copy of the font you intend to use across your platform (or a number of fonts depending on how you plan on having your site)

Add this to your CSS:

@font-face {
   font-family: 'NameofFont'; /* Can be any name you wish this is a backreference for other CSS rules */
   src: url('font/file.ttf'); /* File name of the font file, IE apparently only accepts .EOT fonts; yet test passed on TTF */
}

And add this to any of your supporting rules:

body {
   font-family: NameofFont; /* Must match declaration in @font-face */
}

 

I have a sample in http://darkangel.sytes.net/webfont/

 

It was some random TTF font I downloaded named GoodDog, I was after something artistic and randomly named; you can check it out.

 

Font is NOT installed on my system (I cannot find or select it in a word processor; ect; not found in system font folder.)

 

Tested: [Passed] = Displayed Downloaded font

Android (Dolphin Mini) [Passed]

IE9(x64) [Passed]

Google Chrome [Passed]

FireFox [Passed]