What am I doing wrong? CSS Styling #8


#1

Learn More: Heading
Nice! Next, let’s make the h3 text stand out more by changing the font.

In index.html, inside <div class="learn-more">..</div> are the h3 elements we want to style.

Therefore, we can select this element in CSS like this:

.learn-more h3 {
  ...
}

Instructions
Make a new CSS rule that selects the h3 element inside <div class="learn-more">..</div>
Set font-family to 'Shift', sans-serif
Set the font-size to 18px
Set the font-weight to bold

I have already coded the CSS rule by doing

.learn-more h3 {
...
}

but the coding is wrong somehow


#2

Do really just have ... in your new CSS rule? I also need to see this code :


#3

Try doing this

.learn-more h3 {
font-size: 18px;
font-family: 'Shift', sans-serif;
font-weight: bold;
}

Easy as the instructions tell you, don't forget to add the ";" at the ends.


#4

So I followed the steps and it still tells me I have it wrong. I wrote it as follows:

.learn-more h3 {
font-family: 'Shift', sans-serif;
font-size: 18px;
font-weight: bold;
}

How could I be wrong???


#5

Have a look at this thread, http://discuss.codecademy.com/t/6-and-8-common-problems/9999 -- if you are still stuck come back and let me know.


#6

Just read the article. I've done everything right and I'm still receiving an error. :confused:


#7

Okay, let me have a look at:

  • all of your CSS code.
  • the <head> .. </head> element from your HTML file.

If you need it: How to post code in this forum.


#8

@albionsrefuge,

My <head>...</head> element:

<head>
    <link href="main.css" rel="stylesheet">
    <link href="http://s3.amazonaws.com/codecademy-content/courses/ltp/css/shift.css" rel="stylesheet">
  </head>

My CSS Code:

.nav a {
    color: #5a5a5a;
    font-size: 11px;
    font-weight: bold;
    padding-top: 14px;
    padding-bottom: 14px;
    padding-left: 10px;
    padding-right: 10px;
    text-transform: uppercase;
}

.jumbotron h1 {
    height: 500px;
    background-image: url('https://goo.gl/04j7Nn');
    color: #fff;
    font-size: 48px;
    font-weight: bold;
    font-family: 'Shift', sans-serif;
}

.jumbotron p {
    color: #fff;
    font-size: 20px;
)

.learn-more {
    background-color: #f7f7f7;
}

.learn-more h3 {
    font-family: 'Shift', sans-serif;
    font-size: 18px;
    font-weight: bold;
}

#9

You've used a parenthesis in place of one of your curly braces. Fixing that should get rid of the error message.

I am concerned about this part though:

.jumbotron h1 {
    height: 500px;
    background-image: url('https://goo.gl/04j7Nn');

That makes your h1 element 500px high and gives it a background image. How does that look for you? The plan is for the whole jumbotron to have those styles, not just that one bit of text.


#10

AHHH! I see it now, thank you. I'll fix the .jumbotron syntax as well


#11

I am also not getting it. still giving me error messages


#12

Have you checked this thread yet: