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


Styling Web Pages and Navigation HELP!

Text All In Wrong Places!

http://codepen.io/anon/pen/tpeja is all my code and what it looks like in a browser. The text under the images is for the wrong image. F.E. Truffle Parmasean is where healthy hepps is supposed to be and logemans carmel is where double cheddar should be. (You have to look at my page to understand). Any help is appreciated! THANKS!

2 Answers

Hi Ollie,

You have some invalid html in your page which I would fix first and then see where you're at.

You can't have links as direct children of the unordered list. The li elements should be directly under the ul

Change this:

<a href="Exotic Popcorns/carmel2_compact.png">
            <li><img src="Exotic Popcorns/carmel2_compact.png" alt=""></li>
            <p>Logemann’s Caramel</p>

To this:

    <a href="Exotic Popcorns/carmel2_compact.png">
        <img src="Exotic Popcorns/carmel2_compact.png" alt="">
        <p>Logemann’s Caramel</p>

So you have to move the link inside the list item and have the image and paragraph within the link for all of them.

Thanks, but how do I change the other things?

Well, what results are you getting now after fixing the html? I don't think you updated your codepen. Did you update your local copies to see the results?

I fixed the html for the first two items in your codepen and the captions were side by side in the first row like they should be. I can't see the images in the codepen but only the captions. Your images would have to be hosted somewhere in order to see them.

IT WORKS! At first I thought it was just a small error you were correcting, so I took longer to change it but it works well.

Also, can you tell me how to make it so the orangish colored header reaches the top? Sorry, I'm just starting. I'll update codepen here's link: http://codepen.io/anon/pen/fdxiB