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 Selectors Class and ID Selectors

Janise Bradford
Janise Bradford
5,664 Points
Posted by Janise Bradford
Janise Bradford
5,664 Points

can't figure this out

.container {
  width: 740px;
  margin: auto;

}

<!DOCTYPE html>
<html>
<head>
    <title>Classes and IDs</title>
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
    <div class="container">
        <header>
            Header
        </header>
        <div>

The above code reflects both my style.css and index.html pages. The pages are not centering with the div margin 'auto' property that was set.

Just trying to figure out what I'm doing wrong.

Chris Dziewa
Chris Dziewa
17,781 Points
Chris Dziewa
Chris Dziewa
17,781 Points

Please explain what it is you need help with.

Aimee Ault
Aimee Ault
29,193 Points

Hey Janise,

Just tried your code out and it seems to work for me. Are you sure that your CSS file is saved as style.css inside of a subdirectory called css, relative to where you saved your index.html file?

Janise Bradford
Janise Bradford
5,664 Points
Janise Bradford
Janise Bradford
5,664 Points

The name of the workspace is class_id selectors. These files have been downloaded to my computer in a folder called class_id. I went into this file and uploaded both the index.html and the style.css to my workspace called class_id selectors, individually. Workspaces wouldn't let me upload the actual css folder that these files came in (to my workspace).

I went back and changed the workspace name to css thinking that would help but it didn't.

Could this be possibly a cache problem, because I've been trying the same thing for several hours. Grateful for any and all suggestions.

Thanks so much!

PS Using chrome, I was able to upload the css file and contents (individually), but the code still is not working.

5 Answers

Chris Wise
Chris Wise
7,521 Points
Chris Wise
Chris Wise
7,521 Points

You are centering a div that is 740px wide. If you add a border you can see that. The content inside the div you are centering is not centered.

border

Glenn Gallo
Glenn Gallo
5,297 Points
Glenn Gallo
Glenn Gallo
5,297 Points

It looks like a syntax error with your closing </div>. You show <div>. Missing the /.

Glenn Gallo
Glenn Gallo
5,297 Points
Glenn Gallo
Glenn Gallo
5,297 Points

oops. div.

Janise Bradford
Janise Bradford
5,664 Points
Janise Bradford
Janise Bradford
5,664 Points

So should there be a / closing within the div class like...

<div class="container"></div>
Janise Bradford
Janise Bradford
5,664 Points
Janise Bradford
Janise Bradford
5,664 Points

Tried the above and it caused a sytax error. Wouldn't work.

Checked again and there was not a closing tag for the div class in the video.

Janise Bradford
Janise Bradford
5,664 Points
Janise Bradford
Janise Bradford
5,664 Points

This problem has been solved... Just erased everything and retried and it worked!

Thanks for everyone's suggestions. Very much appreciated!