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

Posted by Ollie _
Ollie _
5,394 Points

Styling Web Pages and Navigation HELP!

Text All In Wrong Places!

Ollie _
Ollie _
5,394 Points

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

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

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>
          </a>

To this:

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

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

Ollie _
Ollie _
5,394 Points

Thanks, but how do I change the other things?

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

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.

Ollie _
Ollie _
5,394 Points

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.

Ollie _
Ollie _
5,394 Points

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

Ollie _
Ollie _
5,394 Points
Ollie _
Ollie _
5,394 Points

THANKYOU!