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 How to Make a Website Styling Web Pages and Navigation Style the Portfolio

Aurelian Sin
Aurelian Sin
12,173 Points

On my Workspace I get only one column of images and the footer is coming up. Please could you help me understand way.

On current exercise .

Please provide more examples, images, or information on your problem so people can better understand what the issue you are facing is.

7 Answers

Isaac Asante
Isaac Asante
4,752 Points

This is either because:

a) You've not reached the part of the course where images are lined up in several columns

b) You are not using the Float property in your stylesheet, along with a width of 45%, for the list items inside your #gallery.

Aurelian Sin
Aurelian Sin
12,173 Points

Thank you very much for your answer, please see below the code:

gallery li{

float: left; width: 45%; margin: 2.5%; background-color:#5f5f5f; color:blue; } and the effect is one column.

Isaac Asante
Isaac Asante
4,752 Points

Hey Aurelian, it should be #gallery li. Don't forget the hashtag symbol before the term gallery, because it's supposed to select the element with that ID. If you write gallery on its own, it's as if you are referring to an element with that name. But there's no valid HTML element called gallery.

Hope this helps.

Aurelian Sin
Aurelian Sin
12,173 Points

Thank you.

Actually have the # before gallery, I lost it on the copy and paste.

Isaac Asante
Isaac Asante
4,752 Points

Ok, I want to clarify. Are you doing the exercise on the following link? http://teamtreehouse.com/library/make-a-css-image-gallery

If yes, then you need to click on Preview to see your changes live. The changes you make there will however NOT reflect in your WorkSpace.

Basically, your whole code at the end of the exercise should be like this:

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: 0px;
  padding: 0px;
  list-style: none;
}

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

Cheers!

Aurelian Sin
Aurelian Sin
12,173 Points

Actually I am not refering to the exercise, I am refering to the workspace. I am working on the workspace and I saved, I refreshed the web page.

Isaac Asante
Isaac Asante
4,752 Points

Sometimes, it can be a web browser caching issue. Just try to view your page in your browser's Private Mode, or Incognito Window (if you are using Chrome). If you are still seeing the same thing, then verify that your stylesheet is properly linked to your HTML file, and that there are no syntax errors in both your HTML and CSS code.

Finally, make sure that the gallery ID is properly spelled in your HTML document. Sometimes, a mistake can prevent the browser from understanding which element it should apply styles to. That's all I can say.

Isaac Asante
Isaac Asante
4,752 Points

Is it working now? Can you see your changes?

Aurelian Sin
Aurelian Sin
12,173 Points

Yes, I found the error was in the was I define the li. I defined only one li instead of defining one li per picture/link. I corrected and it is working,

Thank you very much

Aurelian Sin
Aurelian Sin
12,173 Points

Yes, I found the error was in the was I define the li. I defined only one li instead of defining one li per picture/link. I corrected and it is working,

Thank you very much