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
Kyle Enslin
1,421 PointsWhy does "nav a { color: #fff;}" work but not "nav {text-decoration-color: #fff}" not work for changing text color?
Basically, I'd like to know why Nick adds the "a" when wanting to change the property of the "nav" elements, yet doesn't add the "a" when changing the property of the "h1" and "h2" elements?
3 Answers
Alexander Smith
2,769 Pointsa is reference to anchors most commonly used for links.
nav is reference to the navigation container(basically just there to hold other content for semantic purposes and possibly styling but other tags could be used for that). But since a "nav a" declaration was made as well it overwrites just nav since it's more specific.
Then there is the difference for "color" and "text-decoration-color". Color is used to set the color of the text. Text-decoration-color is used to set the colors of the decorations (not the text itself) such as underlines or strike-throughs if you would like them to be a different color.
I'm kind of at a loss on how to explain the rest. I would say go back through the videos. Review some of the html they go over and then really pay attention when they explain the parts of a CSS stylesheet and some of its basic workings.
Jacob Mishkin
23,117 PointsGreat question! I'll try and do my best to answer each one:
- why not just use the a tag with the h1 and h2 tags? A. You will be selecting all the a tags on the page, not just your navigation elements, and if you want to style the h1 and h2 tags differently with things like line-height, or font size and font style the code below will include all three to those styles:
h1, h2, a {
color: #fff;
}
- why does Nick use the nav a tag when wanting to change the nav elements? A. even though the color of the h1, h2, and a tags are the same, by using nav a what you will be doing is creating a style for ONLY the a tags nested inside the nav tags. so you have more control of the of the styles for the HTML. Like So:
h1, h2 {
color: #fff;
}
nav a {
color: #fff;
/* more code for ONLY the nav a tags */
}
Kyle Enslin
1,421 PointsTESTING
nav a {
color: #fff
}
Kyle Enslin
1,421 PointsKyle Enslin
1,421 PointsThanks, Alexander. I think I understand what you mean. nav, just like header, refers to a defined section. nav a refers specifically to the navigation elements. So, as you say, I need to be more specific.