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

HTML How to Make a Website Beginning HTML and CSS Write a CSS Selector and Property

Liane Lucas
Liane Lucas
45 Points
Posted by Liane Lucas
Liane Lucas
45 Points

I'm stuck. How many curley braces are needed?

guidance please

<h1>{
  <style> {h1}}
  Liane Lucas
    color:blue;}
  </style>
  }</h1>

2 Answers

Steven Parker
Steven Parker
231,269 Points
Steven Parker
Steven Parker
231,269 Points

You'll need one set of them. And here's a few other hints:

  • The style tags must go above the other code
  • With braces, you'll always want to have the same number of opens ({) as you have closes (}).
  • In this case, the braces are only for the CSS rule. They will all be inside the style area.
  • You don't put braces around the selector, just the set of properties that go with it
  • The challenge says to make the color green.

And if you want to see a how it might look all together...

:warning: SPOILER ALERT

<style>
    h1 { color: green; }
</style>
<h1>Liane Lucas</h1>
huckleberry
huckleberry
14,636 Points
huckleberry
huckleberry
14,636 Points

You need two curly braces per CSS rule. However, the CSS rules, if you're placing them inside of your html file, need to go inside of the head. You are trying to place them inside of the actual html element.

Here, take a look

<!DOCTYPE HTML>
    <head>
        <title>Some Title</title>
        <style>

        h1 {
            color:blue;
        }
        </style>
    </head>
    <body>

    <h1>Liane Lucas</h1>

    </body>
</html>

So you see, you have a selector which is the h1 part of the CSS, that tells the browser "ok, I'm gonna be doing a curly brace here and defining some styles, I want you to apply it to h1 elements in the HTML below"

Then an opening brace which tells the browser "k, the rules are gonna start now"

Then you set your rules by using property: value pairs like you did with the color: blue; combo. That's called a declaration.

Then you end it with one final closing curly brace. That let's the browser know "ok, we're done with that CSS rule that got applied to that specific selector. Anything after this is its own thing and start the process of reading and applying that rule to the new selector that's present again"

So now compare that to what you had. See the difference? The style tags go inside the head, and then all your CSS rules go inside of that. That is of course if you're using internal CSS instead of linking to an external files.

None of the CSS rules using curly braces ever go inside of the HTML elements like you were trying. The only thing that goes inside of an HTML element are either 1. Content or 2. Other HTML elements.

I hope that clears everything up.

Cheers,

Huck - :sunglasses: