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

HTML How to Make a Website Responsive Web Design and Testing Responsive Web Design

Posted by Jerilyn P
Jerilyn P
8,788 Points

Can someone check my work?

Before I go any farther, I need help making the website I've been working on as I follow along with Nick look like his. I think I've done all the coding he has but my gallery photos don't line up the way his do and I have a few other problems. Is there someplace I can send or post my work so that someone can check it for me like homework? :(

14 Answers

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

Hi Jerilyn,

It looks like you have several errors here. I recommend that you update your codepen as you fix these errors and then report back here with what is still wrong.

Continue to use both the html and css validators at the w3c and try to fix the errors that they report.

I've left a few comments above and I also noticed in your codepen that you didn't properly close your paragraph tags for your captions.

Example:

<p>Experiments in color and texture.<p>

Should be:

<p>Experiments in color and texture.</p>

Go through all of your captions and make sure you have a proper closing tag.

Let us know where you're at once you fix the errors mentioned so far.

Tom Lawrence
Tom Lawrence
8,685 Points
Tom Lawrence
Tom Lawrence
8,685 Points

codepen is good for doing that so we can all see your code

Jerilyn P
Jerilyn P
8,788 Points
Jerilyn P
Jerilyn P
8,788 Points

OK...uh...I might need some help figuring out how to use that...

Jerilyn P
Jerilyn P
8,788 Points
Jerilyn P
Jerilyn P
8,788 Points

http://codepen.io/anon/pen/jgHpa

Does this work?

Swag Baggity
Swag Baggity
951 Points
Swag Baggity
Swag Baggity
951 Points

What are your problems?

Swag Baggity
Swag Baggity
951 Points
Swag Baggity
Swag Baggity
951 Points

What are your problems?

Jerilyn P
Jerilyn P
8,788 Points
Jerilyn P
Jerilyn P
8,788 Points

My pictures are not lining up side by side like Nick's do in the track. Also, they are too big. Finally, I am not getting the links to have a different color when the cursor is hovered over them like he does. I would also like to know how to reset the links so that they go back to their normal color. Right now I have clicked on them all once and they are the "selected" color.

Jerilyn P
Jerilyn P
8,788 Points
Jerilyn P
Jerilyn P
8,788 Points

/* selected nav link */ nav a: selected, nav a: hover { color: #777; }

I used the w3 validator on my css and found the above issue. Apparently there is a "parse error" with the class: selected and : hover? Or something?

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

I think it should be nav a.selected No space between them and it should be a period not a colon. "selected" is a class name and not a pseudo class

Also, it should be nav a:hover Again no space but here you do use the colon

Jerilyn P
Jerilyn P
8,788 Points
Jerilyn P
Jerilyn P
8,788 Points

Also, here is my full head element. The w3 validator is telling me I have a false > at the end of the font link, but I copied it straight from Google. It's saying that

type='text/css'>

is wrong.

<head> <meta charset="utf-8"> <title>Jerilyn Gashi | Designer</title> <link rel="stylesheet" href="css/normalize.css"> <link href='http://fonts.googleapis.com/css?family=Alegreya+Sans+SC:700italic,700,400,400italic,300|Balthazar|Bentham' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="css/mainj.css"> <link rel="stylesheet" href="css/responsivej.css"> <meta name="viewport" content="width=device-width, intial-scale=1.0"> </head>

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

With the google fonts link you need to url encode the pipe character | (vertical bar)

You have two of them in your link. Replace them both with %7C

Swag Baggity
Swag Baggity
951 Points
Swag Baggity
Swag Baggity
951 Points

Hmm, I'll see if I can contact someone who helped me before, I don't think I've gotten as far as you.

Swag Baggity
Swag Baggity
951 Points
Swag Baggity
Swag Baggity
951 Points

Hmm, I'll see if I can contact someone who helped me before, I don't think I've gotten as far as you.

Swag Baggity
Swag Baggity
951 Points
Swag Baggity
Swag Baggity
951 Points

Actually, at the bottom of this page, it should have suggestions on who you should ask.

Jerilyn P
Jerilyn P
8,788 Points
Jerilyn P
Jerilyn P
8,788 Points

Jason,

Thanks for your help. I noticed the </p>'s too (all on my own! Yay!) and fixed those, and thank you for pointing them out to me. I've made the changes you suggested and here is the Codepen link again:

http://codepen.io/anon/pen/jgHpa

I made the changes you suggested and ran both through the validator again, and it's saying I passed. Thank you!!

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

You're welcome.

So is your page displaying correctly now or are you only passing the validators without errors at this point?

I'm still seeing the old code. If you don't have the option to save or update the pen after you've made those changes then you may need to fork it and provide a new link.

Jerilyn P
Jerilyn P
8,788 Points
Jerilyn P
Jerilyn P
8,788 Points

I think I didn't save the new code in Codepen properly, but it is displaying mostly correctly. There are a few issues, such as a color, that I want to change, but I think I can figure it out from here.