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 Creating HTML Content Include External CSS

Annabelle Chu Yan Fui
Annabelle Chu Yan Fui
1,275 Points

Bullet points still present

I followed the instructions to load the normalize file and have the exact same codes but the bullet points are still present. Even when I copied pasted the code like Nick's html, the bullet points are still present.

Hey Annabelle,

Would you mind posting the code you used to accompany your question?

9 Answers

Annabelle Chu Yan Fui
Annabelle Chu Yan Fui
1,275 Points

I managed to find the problem! Thanks. My css folder was written in caps while i was calling it in lower case.

Florian Goussin while using Codepen or Jsfiddle is also a way to post code sometime it's easier and quicker just to use markdown formatted code to accompany a forum question.

Florian Goussin
Florian Goussin
8,925 Points

thanks for the trick!

Maybe it would be better to show some of these markdown infos directly under the field and to have a button more to show all the detail infos.

Annabelle Chu Yan Fui
Annabelle Chu Yan Fui
1,275 Points
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Annabelle Chu | Engineer</title>
    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="css/main.css">
  </head>
  <body>
    <header>
      <a href="index.html">
        <h1>Annabelle Chu</h1>
        <h2>Engineer</h2>
      </a>
      <nav>
        <ul>
          <li><a href="index.html">Portfolio</a></li>
          <li><a href="about.html">About</a></li>
          <li><a href="contact.html">Contact</a></li>
        </ul>
      </nav>
    </header>
    <section>
      <ul>
        <li>
          <a href="img/numbers-01.jpg">
            <img src="img/numbers-01.jpg" alt="">
            <p>Experimentation with color and texture.</p>
          </a>
        </li>
        <li>
          <a href="img/numbers-02.jpg">
            <img src="img/numbers-02.jpg" alt="">
            <p>Playing with blending modes in Photoshop.</p>
          </a>
        </li>
        <li>
          <a href="img/numbers-06.jpg">
            <img src="img/numbers-06.jpg" alt="">
            <p>Trying to create an 80's style of glows.</p>
          </a>
        </li>
        <li>
          <a href="img/numbers-09.jpg">
            <img src="img/numbers-09.jpg" alt="">
            <p>Drips created using Photoshop brushes.</p>
          </a>
        </li>
        <li>
          <a href="img/numbers-12.jpg">
            <img src="img/numbers-12.jpg" alt="">
            <p>Creating shapes using repetition.</p>
          </a>
        </li>
      </ul>
    </section>
    <footer>
      <a href="http://twitter.com/nickrp"><img src="img/twitter-wrap.png" alt="Twitter Logo"></a>
      <a href="http://facebook.com/abelcyf"><img src="img/facebook-wrap.png" alt="Facebook Logo"></a>
      <p>&copy; 2014 Annabelle Chu.</p>
    </footer>
  </body>
</html>

I was about to ask the same question that Florian Goussin asked. I'm pretty sure that in your main.css you have to declare:

li{
list-style: none;
}

Hi Annabelle,

Are you sure that the normalize.css file is in the css folder? It looks like you are linking to it properly in the html but if none of the styles are taking effect then it sounds like it's not finding the file.

To be clear, at the point you add the normalize.css file you should still have bullet points with your gallery items but you should not have bullet points with your navigation links. The older version of normailze that comes with this project only removes bullet points from lists within the nav element. I think later in the project you will remove the bullet points with your gallery items.

If you're seeing bullets with the navigation then I would make sure your normalize file is in the css folder.

Michelle Cannito
Michelle Cannito
8,992 Points

Oops, here's the correct answer:

li {
list-style-type: none;
}
Annabelle Chu Yan Fui
Annabelle Chu Yan Fui
1,275 Points

It seems that none of my CSS files are loading. No matter what code I write in the main.css, nothing is happening. I do have both normalize and main in my CSS folder and I called them correctly in my index.html file. The normalize.css is just the file that I downloaded and dragged to the workspace under CSS folder.

Annabelle Chu Yan Fui
Annabelle Chu Yan Fui
1,275 Points

It seems that none of my CSS files are loading. No matter what code I write in the main.css, nothing is happening. I do have both normalize and main in my CSS folder and I called them correctly in my index.html file. The normalize.css is just the file that I downloaded and dragged to the workspace under CSS folder.

Annabelle Chu Yan Fui
Annabelle Chu Yan Fui
1,275 Points

Here is the code. I added the main.css line and whatever I write in the main.css while following the tutorial does not work either.

Thanks

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Annabelle Chu | Engineer</title> <link rel="stylesheet" href="css/normalize.css"> <link rel="stylesheet" href="css/main.css"> </head> <body> <header> <a href="index.html"> <h1>Annabelle Chu</h1> <h2>Engineer</h2> </a> <nav> <ul> <li><a href="index.html">Portfolio</a></li> <li><a href="about.html">About</a></li> <li><a href="contact.html">Contact</a></li> </ul> </nav> </header> <section> <ul> <li> <a href="img/numbers-01.jpg"> <img src="img/numbers-01.jpg" alt=""> <p>Experimentation with color and texture.</p> </a> </li> <li> <a href="img/numbers-02.jpg"> <img src="img/numbers-02.jpg" alt=""> <p>Playing with blending modes in Photoshop.</p> </a> </li> <li> <a href="img/numbers-06.jpg"> <img src="img/numbers-06.jpg" alt=""> <p>Trying to create an 80's style of glows.</p> </a> </li> <li> <a href="img/numbers-09.jpg"> <img src="img/numbers-09.jpg" alt=""> <p>Drips created using Photoshop brushes.</p> </a> </li> <li> <a href="img/numbers-12.jpg"> <img src="img/numbers-12.jpg" alt=""> <p>Creating shapes using repetition.</p> </a> </li> </ul> </section> <footer> <a href="http://twitter.com/nickrp"><img src="img/twitter-wrap.png" alt="Twitter Logo"></a> <a href="http://facebook.com/abelcyf"><img src="img/facebook-wrap.png" alt="Facebook Logo"></a> <p>© 2014 Annabelle Chu.</p> </footer> </body> </html>

Annabelle Chu Yan Fui
Annabelle Chu Yan Fui
1,275 Points

Does the code show up nicely? Or do I have to upload it differently? I just copy pasted it.

When posting code to forum, it's best to use the Markdown Cheatsheet that's located under the comment box. The code you posted is missing elements though.

Michelle Cannito
Michelle Cannito
8,992 Points
The CSS property to remove bullet points is this:

{ text-decoration: none; }

To post code, first use 3 backward tick marks.
The backward tick mark is on the same key as the ~. 
On most keyboards, it is in the upper left corner, to
the left of the ! and 1 key.

after posting code, add 3 more backward tick marks
to end it.