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 trialAurelian Sin
12,173 PointsOn 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 .
7 Answers
Isaac Asante
4,752 PointsThis 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
12,173 PointsThank 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
4,752 PointsHey 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
12,173 PointsThank you.
Actually have the # before gallery, I lost it on the copy and paste.
Isaac Asante
4,752 PointsOk, 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
12,173 PointsActually 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
4,752 PointsSometimes, 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.
Aurelian Sin
12,173 PointsThank you very much
Isaac Asante
4,752 PointsIs it working now? Can you see your changes?
Aurelian Sin
12,173 PointsYes, 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
12,173 PointsYes, 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
Reggie Sibley
6,018 PointsReggie Sibley
6,018 PointsPlease provide more examples, images, or information on your problem so people can better understand what the issue you are facing is.