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 The Selectors Solution

Posted by Raul Cathiard
Raul Cathiard
2,143 Points

My CSS text-decoration is not working

For some reason the color is applied but not the text decoration. It's supposed to be none.

Here's a Screenshot: https://imgur.com/KbYjE8k

I think the webkit thing is overriding my text-decoration.

Steven Parker
Steven Parker
231,236 Points
Steven Parker
Steven Parker
231,236 Points

That link doesn't seem to work, but it's not likely to be helpful anyway. To facilitate a complete analysis, make a snapshot of your workspace and post the link to it here.

Raul Cathiard
Raul Cathiard
2,143 Points

Just fixed the link!

Steven Parker
Steven Parker
231,236 Points
Steven Parker
Steven Parker
231,236 Points

But a static image doesn't provide any ability to do analysis. A snapshot of your workspace would.

Trevis Kelley
Trevis Kelley
Courses Plus Student 3,777 Points
Trevis Kelley
Trevis Kelley
Courses Plus Student 3,777 Points

Without being able to view the rest of your CSS code and HTML code, it's impossible to tell what else is going on. The head tag from your website image has no CSS link in it, but without being able to play with it, I cannot find where it's being linked at. I also cannot see what else is being done in your main tag in the CSS, and I cannot tell what other tags or classes are being affected that may create the situation. As Steven said, we really need to see it as a snapshot that we can look at to analyze further.

Raul Cathiard
Raul Cathiard
2,143 Points

Thanks for all your comments and answers!

I'm sorry I couldn't provide the snapshot, I didn't know this feature existed and kept following the videos and closing the console. I'll remember it next time.

1 Answer

Zhen Wong
Zhen Wong
7,816 Points
Zhen Wong
Zhen Wong
7,816 Points

First, Here are some stuff you need to know:

Browsers limits the styles that can be set for a:visited links, due to security issues.

Allowed styles are:

  1. color
  2. background-color
  3. border-color (and border-color for separate sides)
  4. outline color
  5. column-rule-color
  6. the color parts of fill and stroke

***All other styles are inherited from a:link.

reference - https://www.w3schools.com/cssref/sel_visited.asp

Now to apply {text-decoration: none} to the a:visited, what you can do is apply it on the a:link instead

main a:link {
    text-decoration: none;
}
Raul Cathiard
Raul Cathiard
2,143 Points

Thank you!