Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

General Discussion Build a Simple Website Creating a Website Structure Working with Grids

Grid Alignment </div> issue

Hi, I've followed the tutorial so far but when im trying to add the container CSS to align the page to the centre only the top half of the page aligns.

I seem to have found what is causing the issue but afraid this will affect other CSS code.

My code reads as follows in the area which is causing the problem:

http://i158.photobucket.com/albums/t116/martyforster/7ef18f92-004b-45f0-b623-504d94691f25_zpsde67e511.png

Its that final </div> which seems to be causing the alignment issue as if i delete this the full page aligns as it should (and its at this point in the page that everything under it would not centralise.

Also worth noting is I am using Sublime 2 which highlights parts of the code in certain colours.

In the part of the code that reads <div id="featured-cupcake"> the <div id is coloured all green whereas the same command anywhere else in the coding has the div part in red and the id part in green.'''

Does anyone know what could be causing this issue?

8 Answers

Branko Veljkovic
Branko Veljkovic
6,684 Points

can you share the link, or at least, paste html and css code here?

Sorry i tried to paste the html but it isnt visable in the actual post. How would I do this?

James Barnett
James Barnett
39,199 Points

The forum uses markdown to correctly format code, check out this thread on how to type code in the forum for some examples.

Looks like your div tags didn't come through. Maybe you want to try Gist for posting the code? And if you've got different colors going on in Sublime Text 2, you're likely missing a closing bracket or semi-colon somewhere. At least that's what always trips me up.

Stephen Sharkey-Chouinard
Stephen Sharkey-Chouinard
1,692 Points

It’s hard to know without seeing the code but I’ve run into something similar before when I’ve had an extra closing “div” tag appear too early in my HTML. When that happens, it closes off your container div too soon, centring only the upper part of it.

Hi Stephen, yeah this seems to be the issue but I can't seem to find a way to correct it - the opening and closing div for all sections seem to be all the same though this specific one has the different coloured div id for some reason

All the layout and code is the same in the other areas other than this

I've added a link to a screenshot of my code in the original post

ive added link to a screen shot on my code in my original post.....If you look below where I have added the you make me blush image the div id is a different colour and its the closing div below that section which allows the full page to be realigned when it is deleted

Branko Veljkovic
Branko Veljkovic
6,684 Points

You are missing closing tag, <img src="img/you-make-me-blush.gif" alt="" > maybe that is breaking alignment

Stephen Sharkey-Chouinard
Stephen Sharkey-Chouinard
1,692 Points

Not sure where Branko is specifically referencing, but he’s right, your image tag on line 23 is missing it’s closing “>” bracket.

Brilliant, this has corrected it. I couldn't see for looking. Appreciate all the help guys