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 How to Make a Website Responsive Web Design and Testing Build a Three Column Layout

Dennis de Vries
Dennis de Vries
9,440 Points

Two column lay-out (contact page) does not align properly

Hi everyone,

First time running into trouble with the website we're building and I can't seem to figure out where I went wrong.

When making the website responsive using media queries, the contact page is divided into two columns on a big screen, and one column on a small screen. This works, when I make the browser windows small, I can see the 'General information' and 'contact information' popping nicely underneath each other.

When the screen goed bigger, they pop into two columns, one left, one right. However, they remain underneath each other. So the left column has white space next to it, while the right column has white space left to it.

Here's a snapshot of the code. https://w.trhou.se/fnc57ucyjs

As far as I know I've done everything as Nick showed, but obviously I missed something. Hopefully someone can tell me what it is, it's driving me nuts!

1 Answer

Hi Dennis :)

Managed to spot the little error, check out the spelling of the primary class on your contact.html file :) all goes as you would expect after that.

Hope this helps :) Craig

Dennis de Vries
Dennis de Vries
9,440 Points

Wow, I can't believe I missed that! I must've gone over it twenty times and still... Thanks so much!

Important lesson learned: be very, very carefull and precise while typing.

Quick question though, since you seemed to have no trouble picking this out for me. Do you have a trick to spot these minor, yet essential errors?

Dennis

Hi Dennis,

This type of thing is something you will get used to over time and become efficient at spotting the errors. It all just comes from time spent coding this type of thing will happen everyday at some point you will even see on the vids on here the teachers can make a typo but are quick through experience at knowing where to look.

No tricks just made plenty of errors and know where to look :)

A tip would be to code and preview your work in small chunks this will minimize the amount of lines you need to scan through if you know exactly where you code was working correctly to.

Glad you got it sorted and I was able to help :)

Craig