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.

HTML

Rob Wood
Rob Wood
11,089 Points
Posted by Rob Wood
Rob Wood
11,089 Points

Can't get 3 columns in portfolio, and header not responsive

Hi guys,

I'm currently following the 'how to make a website' course and am having some trouble with my code, but can't for the life of me figure out what's wrong.

It seems to work mostly fine on mobile, but the gallery doesn't expand to 3 columns on larger screens, and the heading text doesn't change (it's always in the middle, rather than my name on the left, and nav on the right). Both these things happen on the tutorial.

That's the main problem I'm hoping someone can help with, but also the text underneath each image in the gallery seems to be green (rather than grey as in the tutorial), and without any padding. If anyone has time to check that out too, I'd be very grateful!

My snapshot is: https://w.trhou.se/9482mhor0y

Thanks very much,

Rob

2 Answers

Steven Parker
Steven Parker
215,958 Points
Steven Parker
Steven Parker
215,958 Points

:point_right: On line 123 in main.css, you reference gallery as a tag, not an id (there's no "#"). This causes your margin, padding, font size, and color to not be applied.

The green color is applied to anchors on line 209, but would have a lower specificity when the error on line 123 is corrected.

:point_right: On line 9 of index.html you link to "responsive.css" but your file is actually loacated in the css folder ("css/responsive.css").

:point_right: Also, inside your responsive.css, you are missing a space between the word and and the size specifications on lines 1 and 45. This causes everything in the media queries to be ignored.

Rob Wood
Rob Wood
11,089 Points
Rob Wood
Rob Wood
11,089 Points

Thanks so much Steven, completely missed that! Huge help :-)

Now just the 3 column thing to figure out!

Steven Parker
Steven Parker
215,958 Points
Steven Parker
Steven Parker
215,958 Points

I found the other issues and updated my answer.

Rob Wood
Rob Wood
11,089 Points
Rob Wood
Rob Wood
11,089 Points

Again, thank you so much, really appreciate you taking the time on this! Problem solved :-)