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 How to Make a Website Customizing Colors and Fonts Add Fonts

Michael Jasinski
Michael Jasinski
7,427 Points

Font size and weight

I put my answer in from my workspace that works and its not working. Looking for the Font size and weight

h1{ font-size:1.75em; font-weight: normal; }

index.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Nick Pettit | Designer</title>
    <link rel="stylesheet" href="css/normalize.css">

    <link href='http://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400italic,700italic,400,700,800'
    link rel="stylesheet" href="css/main.css">
  </head>
  <body>
    <header>
      <a href="index.html" id="logo">
        <h1>Nick Pettit</h1>
        <h2>Designer</h2>
      </a>
      <nav>
        <ul>
          <li><a href="index.html" class="selected">Portfolio</a></li>
          <li><a href="about.html">About</a></li>
          <li><a href="contact.html">Contact</a></li>
        </ul>
      </nav>
    </header>
    <div id="wrapper">
      <section>
        <ul>
          <li>
            <a href="img/numbers-01.jpg">
              <img src="img/numbers-01.jpg" alt="">
              <p>Experimentation with color and texture.</p>
            </a>
          </li>
          <li>
            <a href="img/numbers-02.jpg">
              <img src="img/numbers-02.jpg" alt="">
              <p>Playing with blending modes in Photoshop.</p>
            </a>
          </li>
          <li>
            <a href="img/numbers-06.jpg">
              <img src="img/numbers-06.jpg" alt="">
              <p>Trying to create an 80's style of glows.</p>
            </a>
          </li>
          <li>
            <a href="img/numbers-09.jpg">
              <img src="img/numbers-09.jpg" alt="">
              <p>Drips created using Photoshop brushes.</p>
            </a>
          </li>
          <li>
            <a href="img/numbers-12.jpg">
              <img src="img/numbers-12.jpg" alt="">
              <p>Creating shapes using repetition.</p>
            </a>
          </li>
        </ul>
      </section>
      <footer>
        <a href="http://twitter.com/nickrp"><img src="img/twitter-wrap.png" alt="Twitter Logo"></a>
        <a href="http://facebook.com/nickpettit"><img src="img/facebook-wrap.png" alt="Facebook Logo"></a>
        <p>&copy; 2014 Nick Pettit.</p>
      </footer>
    </div>
  </body>
</html>
css/main.css
a {
  text-decoration: none;
}

h1{
font-family: 'Changa One' , sans-serif;

  font-size:1.75em;
  font-weight: normal;
}

#wrapper {
  max-width: 940px;
  margin: 0 auto;
}

#logo {
  text-align: center;
  margin: 0;
}

h1, h2 {
  color: #fff;
}

nav a {
  color: #fff;
}

nav a:hover {
  color: #32673f;
}

4 Answers

Colin Bell
Colin Bell
29,679 Points

Your problem is in your head tag in your HTML. It actually shouldn't have let you pass the first challenge.

You have:

  <head>
    <meta charset="utf-8">
    <title>Nick Pettit | Designer</title>
    <link rel="stylesheet" href="css/normalize.css">

    <link href='http://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400italic,700italic,400,700,800'
    link rel="stylesheet" href="css/main.css">
  </head>

Those last two link tags are what are messing you up. You're missing a rel="stylesheet" and a closing bracket on your first link. You're missing an opening bracket on the second link

It should look something like this:

  <link rel="stylesheet" href='http://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400italic,700italic,400,700,800'>
  <link rel="stylesheet" href="css/main.css">
Michael Jasinski
Michael Jasinski
7,427 Points

BOOOOOOM! Thank you. This drove me up the walls

if this is a code challenge, the problem is probably the extra line above the font-size.

The code challenges are exact because it has to match their answer.

Michael Jasinski
Michael Jasinski
7,427 Points

I tried to move the spaces and make it more neat but nothing. is the code correct besides the spaces? could it be a glitch?

Michael, does it say "Bummer" on your end and if it doesn't, what does it say? I tried your code out with the white space you have, and I was able to pass the challenge. It's very strange that you can't.

Michael Jasinski
Michael Jasinski
7,427 Points

It does say bummer. So the code does work. I just tried t do it again, still the same thing.

Thank you to everyone for helping.

What is your "Bummer" message saying? And are you using this as your h1 code?

/* formatting from above */
h1{
font-family: 'Changa One' , sans-serif;

  font-size:1.75em;
  font-weight: normal;
}
Michael Jasinski
Michael Jasinski
7,427 Points

I am putting what you have above, only difference is I don't have a gap in Family to Size. This is the bummer

" Bummer! Be sure you set the font size to 1.75em for your h1."

I just copied that from what you have in your code in your question. Can you copy and paste what you currently have?

Copy the whole code please. Sometimes you get an error because of a problem above.

Are you talking to MIchael and/or myself, Theodore?

Michael.