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 CSS Foundations Getting Started with CSS Adding CSS to a Page

Jacob Cordeiro
Jacob Cordeiro
934 Points
Posted by Jacob Cordeiro
Jacob Cordeiro
934 Points

CSS not being applied

The CSS is not being applied to the html. I don't know whats going on but heres my CSS

h2{
color: steelblue;
  padding-bottom: 10px;
  border-bottom: 2px dotted;
}

ul{
color: white
    background-color: steelblue;
}

and heres my HTML

<!DOCTYPE html>
<html>
  <head>
    <title>Adding CSS</title>
    <link rel="stylesheet" href="css/style.css">
    <style type="text/css">
    h1 {
      color: white;
      background-color: #E14607;
      }
    </style>
    </head>
<body style="background-color:#BDD4DE;">
    <h1>Adding CSS to the Page!</h1>
    <p style="font-weight: bold;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum non diam justo. Integer accumsan lacus ut quam pulvinar ullamcorper. Proin imperdiet mauris ac lectus blandit adipiscing. Vestibulum placerat mi sit amet odio luctus quis aliquam ante tristique. Praesent sem ligula, rhoncus quis gravida vitae, consequat id odio.</p>
    <p>Etiam eros nisl, pretium nec suscipit ac, gravida quis velit. Phasellus adipiscing ultrices lorem, ut porttitor tellus interdum eu. Fusce auctor, felis vitae adipiscing vulputate, tellus odio venenatis lorem, et pretium lectus justo vitae ipsum. Mauris in dictum dolor. Sed fermentum, dolor nec mollis lobortis, eros augue laoreet tortor, vel cursus neque sem ac diam.</p>
    <h2>Lorem ipsum dolor sit amet</h2>
    <ul>
        <li>Praesent sem ligula rhoncus</li>
        <li>Donec ut ipsum at quam</li>
        <li>Maecenas libero neque accumsan ut</li>
        <li>Donec quis mauris ipsum</li>
    </ul>
</body>
</html>

any advice? Thanks :)

ivomiranda
ivomiranda
30,286 Points

It would be easier to check your code if you used workspaces or Markdown Cheatsheet

<p>Like this :P </p>

(ok this never works so yeah probably workspaces would be better lol)

(ok it worked now. You have to press enter. then the html , then enter again, then the code, then enter again, then then enter again :) )

Jacob Cordeiro
Jacob Cordeiro
934 Points
Jacob Cordeiro
Jacob Cordeiro
934 Points

I am using workspace and my code (I think) aligns with the video

2 Answers

ivomiranda
ivomiranda
30,286 Points

Please take a look at http://web-5ow4hftc53.treehouse-app.com/

You are missing a ; after the color: white in the ul

Please confirm if your style.css is being loaded correctly (is style.css inside the css folder?)

Jacob Cordeiro
Jacob Cordeiro
934 Points
Jacob Cordeiro
Jacob Cordeiro
934 Points

Thanks the folder did it

ivomiranda
ivomiranda
30,286 Points

You're welcome.

Michael Hulet
Michael Hulet
47,913 Points
Michael Hulet
Michael Hulet
47,913 Points

First of all, I fixed up your code to look nice in the Forum. If you want to learn how to do this yourself, you should read the aforementioned Markdown Cheatsheet.

Other than that, the problem might be that you forgot a semicolon. The problem comes when declaring color: white in the ul of your CSS file. Try changing it to this:

ul{
    color: white;
    background-color: steelblue;
}
Jacob Cordeiro
Jacob Cordeiro
934 Points
Jacob Cordeiro
Jacob Cordeiro
934 Points

I just did that . no change at all

ivomiranda
ivomiranda
30,286 Points

Then it's because your style.css isn't being loaded. Please check the demo in my answer. Everything is working correctly as you wish I think. You are just having some problem in loading the style.css please check your filename and location.