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

John Schnettgoecke
John Schnettgoecke
2,012 Points
Posted by John Schnettgoecke
John Schnettgoecke
2,012 Points

Stuck. 2:20-3:00 of Working With Grids Video

I'm stuck on the [Working with Grids] tutorial from the 2:20-3:00 mark. At 3:00, refreshing the browser produces a layout that is centered in the browser window. Up until this point, I believe I have entered all code correctly as shown in the tutorial. However, when I refresh my browser, the layout does not center. Do I have an error in the code somewhere?

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <title>Smells Like Bakin' Cupcake Company</title>
  <link rel="stylesheet" href="css/normalize.css" type="text/css" media="screen">
  <link rel="stylesheet" href="css/grid.css" type="text/css" media="screen">
</head>
<body>
    <div class="container">
        <img src="img/logo.gif" alt="Smells Like Bakin">
      <ul class="nav">
        <li><a href="#">About<a/></li>
        <li><a href="#">Cupcakes &amp; Prices<a/></li>
        <li><a href="#">Locations<a/></li>
        <li class="last"><a href="#">Contact Us</a></li>
      </ul>

4 Answers

julianttt
julianttt
960 Points
julianttt
julianttt
960 Points 
  <div class="container clearfix">
    <div class="grid_4">
      <img src="img/logo.gif" alt="Smells Like Bakin">
    </div>
    <div class="grid_8 omega">
      <ul class="nav">
        <li><a href="#">About</a></li>
        <li><a href="#">Cupcakes &amp; Prices</a></li>
        <li><a href="#">Locations</a></li>
        <li class="last"><a href="#">Contact Us</a></li>
      </ul>
    </div>
            ```
Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

I don't think he is that far in the video yet. I think he's saying that his container isn't centered on the page.

julianttt
julianttt
960 Points
julianttt
julianttt
960 Points 
Check your </a> tags  some are written like this <a/>
     <li><a href="#">About</a></li>
        <li><a href="#">Cupcakes &amp; Prices<a/></li>
        <li><a href="#">Locations</a></li>
        <li class="last"><a href="#">Contact Us</a></li>
Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

+1

Good eye. Didn't catch that myself.

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

Hi John,

It looks like you have the code posting figured out. :)

Here are a few things you can check:

So you don't see equal spacing on both the left and right side? Is your browser wide enough to show this?

Have you verified that you do have "grid.css" inside the "css" folder on your computer?

You've only posted the beginning of your file. Did you close your container div in the correct spot? That div should be closed right before the closing body tag.

Jacob Miller
Jacob Miller
12,466 Points
Jacob Miller
Jacob Miller
12,466 Points

What does your CSS look like?