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 daniel jolly
daniel jolly
272 Points

Lost

My container div isn't containing the code within the body tags. I saved the files from the video and put them in a testsite folder on my desktop and for the url within the link tag i put testsite/normalize.css and the same for the grid I'm using. Put my <div class="container" just under the body and closed it out before the </body> tag and refreshed. Nothing changes on my browser. I feel like the file locations are off and I've tried everything. Even located the file and put the specific location c:desktop/etc... Any ideas?

<!DOCTYPE html>
<html> 
<head><b>GreenToppers</b></head><br>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Western Kentucky GreenToppers</title><br>
    <link rel="stylesheet" href="testsite/normalize.css" type="text/css" media="screen">
    <link rel="stylesheet" href="testsite/grid.css" type="text/css" media="screen">
</head>
<body>
    <div class="container">
        <img src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcSCh8C8ZRxir8zIk-VsaYxJyZm5ZTTWreipUvXA_KM7cgIXIDnS5A"/>
        <ul class="nav">
            <li><a href="#">What are GreenToppers?</a></li>
            <li><a href="#">Gallery</li>    
            <li><a href ="#">Projects</a></li>
            <li class="last"><a href="#">Contact Us</a></li>
        </ul><br>
            <p> The Glasgow GreenToppers mission is to spread the knowledge of living a greener and more sustainable lifestyle.  The GreenToppers also work to obtain information about resources available to support the sustainable lifestyle.  For more information <a href="#"> Click Here</a>
    </div>
</body>
</html>
James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

It's hard to be of much help without seeing your code.

2 Answers

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

Your HTML isn't valid according to the W3C's HTML5 validator

I spotted a few issues.

  • <b> & <br> tags in the <head> section
  • Missing closing </a> & </p> tags
daniel jolly
daniel jolly
272 Points

Why would <b> & <br> in the head matter? Even with the other corrections it still doesn't really answer the underlying problem of my container div. Even with the other issues I could open it up in a browser and seemed to function? Thanks for the feedback though and HTML5 validator is a neat tool.

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

Why would <b> & <br> in the head matter?

Your CSS won't work if you HTML isn't valid.

The <head> tag is only for metadata, there are only 7 legal tags that go in the head section

Even with the other corrections it still doesn't really answer the underlying problem of my container div.

We can't know about any issues with your CSS as you haven't posted it.

daniel jolly
daniel jolly
272 Points

The css data is downloaded directly from the video tutorial. The content itself wouldn't be the problem however the url location I specified might be? What are the steps to saving the file to a folder and identifying it in the html text? Thats what I need clarification on. Thanks.

Using HTML5 I've corrected the html to no errors. Still div container error.

Alexander Sobieski
Alexander Sobieski
6,555 Points
Alexander Sobieski
Alexander Sobieski
6,555 Points

in addition to James Barnett's comments about the <b> and <br> in the head, you also have an extra head close tag:

    <head><b>GreenToppers</b></head><br>
        ....
    </head>
James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

Once you have valid HTML then you just need to make sure your CSS file paths. This primer on file paths should get you going

Alexander Sobieski
Alexander Sobieski
6,555 Points
Alexander Sobieski
Alexander Sobieski
6,555 Points

(to add to this one too)

If your index.html file is IN the /template folder, and if normalize.css (etc.) are in the same folder (and not in a subfolder), you;ve got the wrong URL.

Your css url states that your index is in some directory, and you have a folder in that directory that houses your CSS