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

Posted by orange sky
.a{fill-rule:evenodd;}techdegree
orange sky
Front End Web Development Techdegree Student 4,945 Points

normalize.css is not working on my code

Hello!

Can you please run my code to see if the normalize.css removes the bullets of the links like Nick Pettit mentions in the lecture video? For some reason, normalize doesnt do anything on my index.html

Fyi, I had to go online to find a normalize file because the one in our downloads would not work when I tried to drag it into workspace. Also my index.html and normalize.css are both sitting at the same level on my desktop; however the normalize.css does not seem to reset my index.html

here is the site I used for normalize.css: https://necolas.github.io/normalize.css/

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Hopefully Better | Designer </title>
    <link rel='stylesheet' href='normalize.css'>
  </head>
  <body>
    <header>
      <a href='index.html'>
        <h1>Hopefully Better </h1>
        <h2>Designer</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'>
             <li><img src='img/numbers-01.jpg' alt=''></li>
             <p>Experimentations with colors and texture</p>
            </a>    
        </li>
        <li>
           <a href='img/numbers-02.jpg'>
             <li><img src='img/numbers-02.jpg' alt=''></li>
             <p>Playing with blending modes in Photoshop</p>
            </a>    
        </li>
        <li>
           <a href='img/numbers-06.jpg'>
             <li><img src='img/numbers-06.jpg' alt=''></li>
             <p>Trying to create an 80's styles of glows</p>
            </a>    
        </li>
        <li>
           <a href='img/numbers-09.jpg'>
             <li><img src='img/numbers-09.jpg' alt=''></li>
             <p>Drips created using Photoshop brushes</p>
            </a>    
        </li>
        <li>
           <a href='img/numbers-12.jpg'>
             <li><img src='img/numbers-12.jpg' alt=''></li>
             <p>Creating shapes using repetition</p>
            </a>    
        </li>
      </ul>
    </section>
    <footer>
      <a href='#'><img src='img/twitter-wrap.png' alt='Twitter Logo'></a>
      <a href='#'><img src='img/facebook-wrap.png' alt='Facebook Logo'></a>
       <p>&copy;2016 Hopefully Better  </p>
    </footer>
  </body>

</html>
Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

fixed code formatting

Hi orange sky,

This post here will show you how to post code properly in the community: https://teamtreehouse.com/forum/posting-code-to-the-forum

3 Answers

Alexander Davison
Alexander Davison
65,469 Points
Alexander Davison
Alexander Davison
65,469 Points

The HTML couldn't find a file called normalize.css, so it didn't apply the CSS :)

The normalize.css file is inside the css directory (or folder, whatever you call it).

Instead of linking the file like this:

<link rel='stylesheet' href='normalize.css'>

Since it is in the css directory, you should do this:

<link rel='stylesheet' href='css/normalize.css'>

Good luck! ~alex

Jason Anello
PLUS
Jason Anello
Courses Plus Student 94,610 Points
Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

The version you found was the current 5.0 version but the version used in the course is an older 1.x version.

You can find that here: https://github.com/necolas/normalize.css/tree/v1

The older version has some css that will remove bullets from lists that are within nav elements which is what happens for Nick. This is absent from newer versions of normalize.

I recommend that you switch to that older version while completing this course so that you don't have anymore visual differences from what Nick has.

For brand new projects you can use the latest version.

Also, for organizational purposes I would recommend that you put your css file in a "css" folder. And update your link path accordingly. I'm not sure if Nick covered that yet.

You'll end up having 2 more css files and it would be more organized to have them all in a "css" folder.

Tiya Gatson
Tiya Gatson
229 Points
Tiya Gatson
Tiya Gatson
229 Points

I need help with this topic