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

Riley Kovatch
Riley Kovatch
3,327 Points
Posted by Riley Kovatch
Riley Kovatch
3,327 Points

I'm doing it right!

Want to move on

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 li {
  margin: 0px 0px 0px;
  padding: 0;
  text-decoration: none;
}

5 Answers

Joshua Harman
Joshua Harman
8,821 Points
Joshua Harman
Joshua Harman
8,821 Points

Hi Riley!!

So you did great inputting this and passing the first objective. Good job!! 

img {
  max-width: 100%;
}

The next part here you entered this:

#gallery li {
  margin: 0px 0px 0px;
  padding: 0;
  text-decoration: none;
}

But it didn't ask for the list item, just the gallery ID. Does that make sense? You needed this:

#gallery {}

Secondly, you were right in setting the margin to 0px, but what it's looking for is just this:

#gallery {
     margin: 0;
}

And lastly for this second objective, to get rid of the bullet point, what it was looking for was not text-decoration, but actually this (and you'll probably face-palm here):

#gallery {
     list-style: none;
}

So without just giving you the full answer, here's how you can move to the next objective!!!

I hope this helps!!!!

(PS if someone answers your question and it helps, get in the habit of giving those around you an "upvote" or a "Best Answer".

It makes them feel good, and you'll find you need them (upvotes and Best Answers) later on, and also -others may return the favor!!! )

KEEP UP THE GOOD WORK, STAY ENCOURAGED AND KEEP CODING NO MATTER HOW HARD IT GETS!!!! :-) (and take notes)

Carol Dew
Carol Dew
5,923 Points
Carol Dew
Carol Dew
5,923 Points

1) Your styling should be set to the #gallery ... not to #gallery li . This part of the challenge was to remove the padding, margin, and bullet points from the #gallery element, not to the list items inside #gallery. Bullet points are part of the list-style property of lists, not of list items.

2) You remove bullet points in a list with list-style, not text-decoration. Text-decoration is used when you want to remove the underline in link text.

Try this:

gallery {

margin: 0; padding: 0; list-style: none; }

HTH! I'm stuck on the next step of the same challenge.

Joshua Harman
Joshua Harman
8,821 Points
Joshua Harman
Joshua Harman
8,821 Points

Hi Carol!

For the next step you start with the gallery list item right? Float it, add the width:

#gallery li {
  float: left;
  width: 45%;

then follow the next step:

#gallery li {  
     margin: 2.5%;
     color: blue; /*not 'text-color' */
     background-color: green;
}

Let me know if this helps!!

Happy Coding!!!

Also... might I suggest checking out the Markdown Cheatsheet below? It shows you how to access in-forum code including the cool coding colors like the ones I'm using. :-)

Carol Dew
Carol Dew
5,923 Points
Carol Dew
Carol Dew
5,923 Points

Hi Joshua,

Many thanks for your response. I should have said I was stuck on the last part of the challenge; the addition of color and background-color to the li. I have been writing CSS for years (taking this part of the course because I didn't jump on the RWD wagon as soon as I should have) ... and I swear I was typing it in correctly. Several times. I kept getting errors saying to add the color & background color on the li. That's how I wound up finding this question.

I think what happened is that I was adding all the #gallery li properties in one rule, and it wanted them in two separate rules like you've posted above. I finally made it past the challenge, though, thank goodness :)

Thanks for the tip on the Markdown cheatsheet. Actually, for my old eyes, any text on a black background is very difficult to see, especially the way the in-forum / code challenge colors are formatted; not enough contrast on the curly braces and semi-colons to see them without bringing the laptop right up to my face. Accessibility fail ;)

Thanks again for your help! :)

Konrad Pilch
Konrad Pilch
2,435 Points
Konrad Pilch
Konrad Pilch
2,435 Points

I though u finished this piece of code and wanted to show us what u achieved so u pasded the code to show off xd as you said u did it .

Joshua Harman
Joshua Harman
8,821 Points

Lol. Glad you passed it, and glad for your patience with me as you already know the topic ;-)

That being said, Do you have any good CSS tips?

Konrad Pilch
Konrad Pilch
2,435 Points
Konrad Pilch
Konrad Pilch
2,435 Points

Good Job! Keep it up! A BIG price is on the next side :)

Carol Dew
Carol Dew
5,923 Points
Carol Dew
Carol Dew
5,923 Points

Joshua, no patience was needed :) I'm a bit rusty, so I'm re-learning some things here, too! As far as tips go, I can't think of anything offhand (other than to read the specs, boring as they can be! ... and practice, practice, practice, because if you don't, you wind up like me - rusty!), but I'll be happy to help with questions if I can.