Question about HTML and CSS coding

Questions about applications and software
Forum rules
Before you post please read this

Question about HTML and CSS coding

Postby Sleven on Tue Apr 02, 2013 2:50 pm

I've been working thru Code Academy's HTML course and everything has worked as expected except
font-family, the font never changes.

Now I'm up to the CSS section and font-family does not work there either, the font does not change to cursive. I have tried using a lowercase c on cursive and a capital c, Cursive it makes no difference the font does not change to cursive.

Here is what the CSS code looks like
Code: Select all
span {
        font-family: cursive;
    }

and here is a portion of the HTML code
Code: Select all
<body>
      <p>Much of this is regular text, but some of it is <span>fancy</span>!
      We can use our <span>newly fancified font</span> to add some
      <span>flair</span> to our website. It'd be a <span>royal pain</span>
      to make each of these span tags <span>fancy</span> individually,
      but it's a cinch with <span>CSS</span>!</p>
   </body>

When I hit the summit button it says I did it right and bring up the next section.
I logged on to Code Academy using my wife's computer and the same code worked perfectly. I tried the font "times" and again it worked on her's but not on my computer. She is running Windows 7 on her machine and I am running LMDE Cinnamon 64 on mine. We both use Chrome as a browser.
Any ideas why it does not work on my Linux OS?
LMDE 64 running Cinnamon on an HP Compaq Core2 Duo 4G Ram
User avatar
Sleven
Level 4
Level 4
 
Posts: 405
Joined: Sun Oct 03, 2010 9:03 am
Location: Central Florida

Linux Mint is funded by ads and donations.
 

Re: Question about HTML and CSS coding

Postby xenopeek on Tue Apr 02, 2013 3:31 pm

Perhaps you don't have a font installed for that? What does it do on the default browser, Firefox. It's no secret that Chrome doesn't integrate well with the Linux desktop.

I opened the following file in Firefox:
Code: Select all
<html><head><style>
    span {
            font-family: cursive;
        }
</style></head>
    <body>
          <p>Much of this is regular text, but some of it is <span>fancy</span>!
          We can use our <span>newly fancified font</span> to add some
          <span>flair</span> to our website. It'd be a <span>royal pain</span>
          to make each of these span tags <span>fancy</span> individually,
          but it's a cinch with <span>CSS</span>!</p>
       </body>
</html>

Works fine (click to zoom):
Image
User avatar
xenopeek
Level 21
Level 21
 
Posts: 14664
Joined: Wed Jul 06, 2011 3:58 am
Location: The Netherlands

Re: Question about HTML and CSS coding

Postby Sleven on Tue Apr 02, 2013 5:14 pm

In the example you illustrated the font change was very obvious, I could tell as soon as I saw it.

I did the same section of code in Firefox and I had to look really close at the font to tell there was any difference at all, it did change but only minutely, not like your example at all.

I suppose it is a Chrome issue, as Chrome didn't change at all.
LMDE 64 running Cinnamon on an HP Compaq Core2 Duo 4G Ram
User avatar
Sleven
Level 4
Level 4
 
Posts: 405
Joined: Sun Oct 03, 2010 9:03 am
Location: Central Florida

Re: Question about HTML and CSS coding

Postby xenopeek on Wed Apr 03, 2013 12:49 am

Do you have the Microsoft fonts installed? I do, that might make a difference. I think also on LMDE you install those with the package: ttf-mscorefonts-installer
User avatar
xenopeek
Level 21
Level 21
 
Posts: 14664
Joined: Wed Jul 06, 2011 3:58 am
Location: The Netherlands

Re: Question about HTML and CSS coding

Postby Sleven on Wed Apr 03, 2013 6:01 am

I downloaded the ttf-mscorefonts-installer using synaptic,

How do I use it?
LMDE 64 running Cinnamon on an HP Compaq Core2 Duo 4G Ram
User avatar
Sleven
Level 4
Level 4
 
Posts: 405
Joined: Sun Oct 03, 2010 9:03 am
Location: Central Florida

Re: Question about HTML and CSS coding

Postby xenopeek on Wed Apr 03, 2013 6:15 am

If it is installed, you will be already using it. When you ask for a cursive font, those new fonts you installed might also be used as a best match for the font family you requested. For better results, select the font by name.
User avatar
xenopeek
Level 21
Level 21
 
Posts: 14664
Joined: Wed Jul 06, 2011 3:58 am
Location: The Netherlands

Re: Question about HTML and CSS coding

Postby Sleven on Wed Apr 03, 2013 6:32 am

Thank you for the help.

The font in Firefox changed, looks just like your example now, there was no change in Chrome with the Cursive font but I did notice that Courier works in Chrome. I'm guessing that Chrome has a limited number of internal fonts available.

Researching it a bit more I see that Chrome has some Add ons that lets you use different fonts
LMDE 64 running Cinnamon on an HP Compaq Core2 Duo 4G Ram
User avatar
Sleven
Level 4
Level 4
 
Posts: 405
Joined: Sun Oct 03, 2010 9:03 am
Location: Central Florida

Linux Mint is funded by ads and donations.
 

Return to Software & Applications

Who is online

Users browsing this forum: No registered users and 1 guest