Fallback font

<PLEASE USE THIS TEMPLATE TO HELP YOU CREATE A GREAT POST!>

<Below this line, add a link to the EXACT exercise that you are stuck at.>
https://www.codecademy.com/courses/learn-html-css/lessons/css-fonts/exercises/fallback-fonts?action=lesson_resume

<Below this line, in what way does your code behave incorrectly? Include ALL error messages.>
Did you add the fallback fonts to the main heading?

```

body {
/* Old browsers /
background: #141E30;
/
Chrome 10-25, Safari 5.1-6 /
background: -webkit-linear-gradient(-45deg, #35577D, #141E30);
/
W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
background: linear-gradient(-45deg, #35577D, #141E30);
margin: 0;
padding: 0;
}

h1, h2, h3 {
font-family: Garamond, serif;
}

h1 {

color: #FFF;
font-size: 32px;
padding-top: 100px;
text-align: left;
width: 60%;
}

h2 {
font-family: Garamond, serif;
border-bottom: 1px solid rgba(255, 255, 255, 0.5);
color: rgba(255, 255, 255, 0.5);
font-weight: 100;
font-size: 22px;
line-height: 24px;
padding-bottom: 30px;
text-align: left;
width: 70%;
}

p {
font-family: “Helvetica”;
color: AliceBlue;
line-height: 1em;
text-align: left;
width: 100%;
}

.byline {
color: rgba(255, 255, 255, 0.5);
float: left;
font-family: ‘Roboto’, sans-serif;
font-weight: 100;
font-size: 14px;
padding-left: 10px;
text-transform: uppercase;
}

.caption {
background-color: rgba(0, 0, 0, 0.6);
color: rgba(255, 255, 255, 0.65);
display: block;
font-family: ‘Playfair Display’, serif;
font-size: 14px;
font-style: italic;
line-height: 14px;
margin-left: 20px;
padding: 10px;
position: relative;
top: 80%;
width: 60%;
}

.content {
padding: 40px;
}

.image {
background-image: url(“https://s3.amazonaws.com/codecademy-content/courses/web-101/unit-4/htmlcss1-img_soccer.jpeg”);
background-size: cover;
background-position: center;
height: 300px;
}

.writer-img {
-webkit-box-shadow: 5px 0px 5px 0px rgba(0, 0, 50, 0.97);
-moz-box-shadow: 5px 0px 5px 0px rgba(0, 0, 50, 0.97);
box-shadow: 5px 0px 5px 0px rgba(0, 0, 50, 0.97);
float: left;
width: 50px;
}

<do not remove the three backticks above>

I’m having trouble with this same exercise, but I spotted a mistake in code.

The instructions say to add two fallback fonts, not remove the first choice font. Below is the property you want to use:

font-family: Georgia, Garamond, serif;

Another issue you might run into is how you set the font-family property of h2 in two places. Only the last place in the style sheet will matter. The first place is in the selector h1, h2, h3 { .. }, and the second place is in h2 { .. }.

2 Likes

mine lilterally looks like
font-family: Georgia, Garamond, serif;
and it still won’t work no matter what I do

I have the same problem. Code looks correct, but it is not accepted by the system.

h1 {
color: #FFF;
font-size: 32px;
font-family: Georgia, Garamond, serif;
padding-top: 100px;
text-align: left;
width: 60%;
}

h2 {
border-bottom: 1px solid rgba(255, 255, 255, 0.5);
color: rgba(255, 255, 255, 0.5);
font-weight: 100;
font-size: 22px;
font-family: Georgia, Garamond, serif;
line-height: 24px;
padding-bottom: 30px;
text-align: left;
width: 70%;
}

error message says “Did you add fallback fonts to the main heading?” Bug report submitted, just in case.

I have same issue. Code def looks correct but not accepted. Same error message I am getting. I too have submitted bug report. Very frustrating

Ye same man. Ultra piss take! :confused:

I changed my browser to Google Chrome and it worked for me

1 Like

yh that works cheers

The same issue, didn’t work on Edge and Firefox. Migration to Chrome solved the problem.

I’ve had the same problem. “Fallback font” does not work on Firefox Linux Ubuntu 12.04. Migration to Chromium Linux Ubuntu 12.04 helped to resolve this unpleasantness.

guys give all the style.css code cuz it doesn’t work for me and i am working on google chrome :angry:

h1, h2, h3 {
font-family: Georgia, ‘Garamond’, serif;
}

this one worked for my .

So I have to switch browsers? Arg a bit annyong, but I will try it. Chrome conspiricy I say! >.>

Same issue, my configuration:
Firefox 49.0 on Ubuntu 16.04 LTS (Mint)

I switched to Chromium 53.0 and it is working fine.

now Im having the same problem with the second Instruction

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.