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 CSS: Cascading Style Sheets Use ID Selectors

youssef elmaraghy
youssef elmaraghy
140 Points

I am unable to remove the underline from my nav I have no errors main.css is listed under the css folder

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

        <a href="index.html" >

        <h1>Nick Pettit</h1>
        <h2>Designer</h2>
     </a>

       <nav>
           <ul>
             <li><a href="index.html"> portfoilo</a></li>
             <li><a href="about_me.html"> about me</a></li>
             <li><a href="contact_me.html"> contact me </a> </li>
             <li><a href="pictures.html"> pictures </a> </li>
             <li><a href="cell phone.html"> cell phone </a> </li>
             <li><a href=" inner me.html"> me</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>Experiantal with color and texture</p>
                  </a>
                  </li>
                  <li>
                  <a href="img/numbers-02.jpg">
                      <img src="img/numbers-02.jpg" alt="">
                      <p>Experiantal with color and texture</p>
                  </a>
                  </li>
                  <li>
                  <a href="img/numbers-06.jpg">
                      <img src="img/numbers-06.jpg" alt="">
                      <p>Experiantal with color and texture</p>
                  </a>
                  </li>
                  <li>
                  <a href="img/numbers-09.jpg">
                      <img src="img/numbers-09.jpg" alt="">
                      <p>Experiantal with color and texture</p>
                  </a>
                  </li>
                  <li>
                  <a href="img/numbers-12.jpg">
                      <img src="img/numbers-12.jpg" alt="">
                      <p>Experiantal with color and texture</p>
                  </a>
                  </li>

                </ul>

               </section>
          <footer>
            <a href="https://www.twitter.com"><img src="img/twitter-wrap.png" alt="Twittter logo"> </a>
            <a href="https://www.facebook.com"><img src="img/facebook-wrap.png" alt="Facebook logo"></a>
            <a href="https://www.youtube.com/watch?v=gQMymYiHMaA"><img src="img/Earth-icon.png" alt" moive"></a>
      <p>&copy; 2013 Nick Pettit.</p>
          </footer>
      </div>
  </body>
</html>

under main.css

a {
text-decoration: none;
}

( any changes I enter under main.css, nothing is applied or nothing changing for some reason

Wayne Priestley
Wayne Priestley
19,579 Points

I've edited your code so it appears correct in your post.

Here is a link to explain how to use Markdown to post your code How to post code

If you look at the bottom of the box when your typing a reply you will see Markdown Cheatsheet that will also explain how to post your code.

3 Answers

Hi!

Make sure you are saving all of your files before you refresh the page.

If that does't work then add the code below and that might help out.

You may also need to add this code to remove the underlines.

a:visited {
    text-decoration: none;
}
derekverrilli
derekverrilli
8,841 Points

You're missing the html , head and body tags. This can cause all types of wacky behavior. It should work fine once your mark up is semantically correct.

This should always be your default template:

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
  </body>
</html>

Second, if you want to target the 'a' within 'nav' do it like this:

nav a {
  text-decoration: none;
}

Hi Derek!

He actually does have all the correct tags and his HTML is completely fine. I will format it properly in his post to show you!

Next time you post code Youssef refer to the Markdown Cheatsheet below the post box and it will show you have to properly format your code.

derekverrilli
derekverrilli
8,841 Points

Ah, ok. Couldn't see any other reason why it wasn't working. Thanks Luke :)

No problem!

I am having the same problem. I followed the video and I could'nt get the background color to change or the line under the links to disappear. Has this been resolved?