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 Styling Web Pages and Navigation Make a CSS Image Gallery

Posted by rmgvqegryz
rmgvqegryz
3,970 Points

Color of gallery list items

I can choose a color for the gallery text and also for the background. When I preview my work, it does exactly what I wanted. But when I check my work, it says: "Be sure to set the color for gallery list items to a color of choosing. I don't see the issue, maybe someone can help me?

css/main.css 
a {
  text-decoration: none;
}

#wrapper {
  max-width: 940px;
  margin: 0 auto;
}

#logo {
  text-align: center;
  margin: 0;
}

h1, h2 {
  color: #fff;
}

nav a {
  color: #fff;
}

nav a:hover {
  color: #32673f;
}

h1 {
  font-family: ‘Changa One’, sans-serif;
  font-size: 1.75em;
  font-weight: normal;
}

img {
  max-width: 100%;
}

#gallery {
  margin: 0;
  padding: 0;
  list-style: none;
}

#gallery li {
  float: left;
  width: 45%;
  margin: 2.5%;
  color: #000000;
  background-color: #e5e5e5;
}

#gallery li a p {
  color: #000000;
}

3 Answers

Stanley Thijssen
Stanley Thijssen
22,831 Points
Stanley Thijssen
Stanley Thijssen
22,831 Points

Hi,

You shouldn't be using a p tag inside an anchor (a) tag. Simply use an a tag alone without a p tag inside of it.

rmgvqegryz
rmgvqegryz
3,970 Points

Thank you very much! That was the exact problem. However, I find this a bit strange that in the course video: we're supposed to use the p-tag. Do you have some explanation why they do so in the course video and not in this example (code above)?

Stanley Thijssen
Stanley Thijssen
22,831 Points
Stanley Thijssen
Stanley Thijssen
22,831 Points

I think they used an anchor (a) tag inside a paragraph (p) tag so you turned the two around. Because you should be using the other way around. You cant use p tag's inside a tags.

rmgvqegryz
rmgvqegryz
3,970 Points

Actually they used a paragraph and an image inside an anchor, because they want to create a photo gallery. And when you click an element of that photo gallery (both the image and the description), you should be linked to another page with the image in full size. So the structure (html) of this photo gallery is... Unordered list, inside the (ul) 5 list items, inside the (li) an anchor, inside (a) an image and a paragraph.

Stanley Thijssen
Stanley Thijssen
22,831 Points
Stanley Thijssen
Stanley Thijssen
22,831 Points

Its true its possible with html 5 i was confused with html 4 where it's not allowed.