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

Posted by Prashant Tiwari
Prashant Tiwari
Courses Plus Student 385 Points

when i am applying styling to my header element why it is not showing any change?

my css code

header { color: #6ab47b ; border-color: #599a68; }

2 Answers

Maor Tzabari
Maor Tzabari
1,762 Points
Maor Tzabari
Maor Tzabari
1,762 Points

You have to set width and height : )

Prashant Tiwari
Prashant Tiwari
Courses Plus Student 385 Points

but i am doing exactly whatever was said in video lectures :( and there was nothing about width and height for regarding element i.e header. :(

Maor Tzabari
Maor Tzabari
1,762 Points
Maor Tzabari
Maor Tzabari
1,762 Points

I didn't do the CSS course on this website, but maybe you should report to the support, that way if something wasn't clear on the tutorials they would probably update it so others can understand it easily too ; )

Tim Knight
Tim Knight
28,888 Points
Tim Knight
Tim Knight
28,888 Points

The header is going to take the height of your content by default so make sure you have content in your header. Additionally if you're wanting to use the border you'll want to include a border width and style in there. To Maor point, another option would be to manually set the height of the header, but the width by default will be 100% which should be fine in most cases.

Here's an example:

<header>
</header>
<br>
<header class="dimensions">
</header>
<br>
<header>
  Content
</header>

header { 
  color: #6ab47b ; 
  border-color: #599a68;
  /* You might also want to add in style and width */
  border-style: solid;
  border-width: 1px;
}

header.dimensions {
  height: 50px;
}

You can see in the second example I'm adding the height dimensions, but in the third I'm just adding content. Both woudl be visible here. If you want to write the border attributes in a shorthanded style you could do this:

border: 1px solid 599a68;
Prashant Tiwari
Prashant Tiwari
Courses Plus Student 385 Points

thank you :)