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

Posted by John McCart
John McCart
Courses Plus Student 1,965 Points

All my html is working but when I add CSS nothing changes..

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> John McCart | Designer </title> <link rel="stylesheet" href="css/normalize.css"> <link rel="stylesheet" href="css/main.css"> </head> <Body> <header> <a href=”index.html”>
<h1>John McCart</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> <div id="wrapper"> <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 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 rushes</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/ilovesabryna"><img src="img/facebook-wrap.png" alt="Facebook Logo"></a>
  <p>&copy; 2015 John McCart.</p>
  </footer>

</div> </Body> </html>

Here is the css

a { text-decoration: none; }

wrapper {

max-width:940px; margin: 0 auto; padding: 0 5%; background: orange; }

John McCart
John McCart
Courses Plus Student 1,965 Points

The css was posted weird but in the document everything is structured properly.

Jesus Mendoza
Jesus Mendoza
23,289 Points

Your css file must be inside a folder called css and must be named main.css

1 Answer

Michael Harper
Michael Harper
14,741 Points
Michael Harper
Michael Harper
14,741 Points

Hi John,

I'm guessing the code is snippets, and there's a <body> tag between the </head> and <a href... shown?

Not actually seeing 'wrapper' used in the HTML anywhere, AND is it an id or class? Would need to be either .wrapper or #wrapper in the CSS, then applied an html element as class="wrapper" or id="wrapper".

The CSS snippets seem OK, could problem be file paths? A quick and practical way to verify paths is to View Source in a browser, then click the links to your CSS, JS, etc. If the path is wrong, you'll get a 404; if correct, will see the source code.

Does it make a diff if you include the type, eg: <link rel="stylesheet" type="text/css" href="css/main.css">

John McCart
John McCart
Courses Plus Student 1,965 Points

hello, i solved the problem, my folder was CSS and i changed it to small letter css and now it works.