Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS CSS Basics (2014) Understanding Values and Units Styling the Intro Paragraph

Nenad Jovic
Nenad Jovic
7,883 Points

Create a new rule that targets the span element inside .intro. Give the span element a bold font weight and an italic fo

Can someone help me out with this? can't pass this challenge

index.html
<!DOCTYPE html>
<html>
  <head>
    <title>Lake Tahoe</title>
    <link rel="stylesheet" href="page.css">
    <link rel="stylesheet" href="style.css">
  </head>
  <body> 
    <header id="top" class="main-header">
      <span class="title">Journey Through the Sierra Nevada Mountains</span>
      <h1>Lake Tahoe, California</h1>
    </header>
    <div class="primary-content t-border">

      <p class="intro">
        Lake Tahoe is one of the most <span>breathtaking attractions</span> located in California. It's home to a number of ski resorts, summer outdoor recreation, and tourist attractions. Snow and skiing are a significant part of the area's reputation.
      </p>

      <a href="#more">Find out more</a>
    </div>
    <footer class="main-footer">
      <p>All rights reserved to the state of <a href="#">California</a>.</p>
      <a href="#top">Back to top &raquo;</a>
    </footer>
  </body>
</html>
style.css
/* Complete the challenge by writing CSS below */
.intro {
  font-size: 1.25em;
  line-height: 1.6em;


}

27 Answers

Nenad Jovic
Nenad Jovic
7,883 Points

Finally figured it out here is the answer http://prntscr.com/5fo2t7

hadassahmiggiani
hadassahmiggiani
3,848 Points

Did you try this?

.intro { font-size: 1.25em; line-height: 1.6; }

.intro span { font-weight: bold; font-style: italic; }

Thank You!

You're almost there...

Just turn your selector into a descendant selector to get to span, so it looks like this:

.intro span {
   font-size: 1.25em;
   line-height: 1.6em;
   font-weight: bold;
   font-style: italic;

Just out of curiosity, have you tried submitting it with just:

.intro span {
  font-weight: bold;
  font-style: italic;
}

It seems that's all the challenge is asking you to do. Or is the font-size and line-height from a previous step?

This works as well

.intro{ font-size: 1.25em; line-height: 1.6; }

.intro span { font-weight: bold; font-style: italic; }

Thanks DigDev that works.

Rob Anderson
Rob Anderson
6,060 Points

you're almost there... add this to your html file... You're trying to style a class that doesn't exist in your html document and that's why it's coming up failed... in the real world, the browser probably wouldn't care...

<span class="intro">

p.s. I'm doing an endzone dance right now cuz I'm new to this and I was actually able to figure this out and help someone... 44 y/o and I can still learn

try this one it is 100% correct

.intro { font-size: 1.25em; line-height: 1.6; }

.intro span { font-weight: bold; font-style: italic; }

Sorry it's taking a bit to figure out.

Can you post an updated screenshot?

Also, try removing the span around the intro class. Spans shouldn't contain a block element like that.

Nenad Jovic
Nenad Jovic
7,883 Points

It's same like pic above.

Your CSS in http://prntscr.com/5fm9cb is only targeting .intro, you need to target .intro span, like so:

.intro span {

}
Filippo D'Arrigo
Filippo D'Arrigo
5,285 Points

It worked fine for me this way, give it a go.

.intro { font-size: 1.25em; line-height: 1.6em; }

.intro span { font-weight: bold; font-style: italic; }

Honza Noel
Honza Noel
2,779 Points

That's the one!!! Cheers dude.

Miriam Allman
Miriam Allman
Courses Plus Student 1,761 Points

Thanks Filippo - I looked back at your answer from 2015 and it answered my question from tonight.

Many thanks

Miriam

This worked Fillippo. Thank you!

.intro{ font-size: 1.25em; line-height: 1.6; }

.intro span { font-weight: bold; font-style: italic; }

I could not figure out why my answer wasn't working, reviewing the video several times and checked MDN and W3 for help. I finally figured out it was my HTML that was incorrect, not my CSS. This is the correct answer for HTML and CSS that finally worked.

HTML <p class="intro"> Lake Tahoe is one of the most <span>breathtaking attractions</span> located in California. It's home to a number of ski resorts, summer outdoor recreation, and tourist attractions. Snow and skiing are a significant part of the area's reputation. </p>

CSS

.intro { font-size: 1.25em; line-height: 1.6; }

.intro span { font-weight: bold; font-style: italic; }

I've been trying this all day, and this finally worked for me. Thank you for your clarification!

Your question got cut off but have you tried:

/* Complete the challenge by writing CSS below */
.intro span {
  font-size: 1.25em;
  line-height: 1.6em;
  font-weight: bold;
  font-style: italic;
}
Nenad Jovic
Nenad Jovic
7,883 Points

Thanks for your responds guys, I did all of above even before asking this question and it didn't work http://prntscr.com/5f4dca really not sure where am mistaking.

.intro span{
  font-weight:bold;
  font-style:italic;
}

This passes the code test.

Nenad Jovic
Nenad Jovic
7,883 Points

So no solution for this lol

There have been a few suggestions that you haven't responded to.

Why don't you show a current screenshot of the error, along with the current HTML/CSS. Otherwise we won't be able to give you more suggestions.

Nenad Jovic
Nenad Jovic
7,883 Points

http://prntscr.com/5fm95k http://prntscr.com/5fm9cb

And no those above i tried already and it doesn't work.

Nenad Jovic
Nenad Jovic
7,883 Points

Did that as well as i said, and it's still not passing..this must be some kind of bug then, becasue i really don't see what else can i try..

It's also not working for me and I'm 99.9999% everything is typed in correctly. Was this a bug?

its also not working for me!

Aynur Ganbarova
Aynur Ganbarova
1,849 Points

Here we go))

/* Complete the challenge by writing CSS below */ .intro { font-size: 1.25em; line-height: 1.6em; font-weight: bold; font-style: italic; } .intro span { font-weight: bold; font-style: italic; }

Gaby Esu
Gaby Esu
882 Points

I don't understand how the span can be a descendant of intro if its much later in the code... can someone explain this to me please?

There is a SPAN in <P> : <p class="intro"> Lake Tahoe is one of the most <span>breathtaking attractions</span> located in California. It's home to a number of ski resorts, summer outdoor recreation, and tourist attractions. Snow and skiing are a significant part of the area's reputation. </p>. Took me a while to find it, forgot to scroll all way.

Try this :

.intro { font-size: 1.25em; line-height: 1.6;

}

.intro span { font-weight: bold; font-style: italic; }