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 Debugging HTML and CSS Problems Continue Learning

Tony Brown
PLUS
Tony Brown
Courses Plus Student 1,134 Points
Posted by Tony Brown
Tony Brown
Courses Plus Student 1,134 Points

how can I make my gallery links all the same size. i think it may be a problem with my anchors?

<section> <ul id="gallery"> <li> <a href="img/numbers-06.jpg"> <img src="img/numbers-06.jpg" alt=""> <p>Moleskin Large Hardcover Notebook</p> </a> </li> <li> <a href="img/numbers-01.jpg"> <img src="img/numbers-01.jpg" alt=""> <p>mobile Phone Holder</p> </a> </li> <li> <a href="img/numbers-03.jpg"> <img src="img/numbers-03.jpg" alt=""> <p>Multi-Function Bottle / Wine Opener</p> </a> </li> <li> <a href="img/numbers-04.jpg"> <img src="img/numbers-04.jpg" alt=""> <p>BICA Mechanical Pencil Grip</p> </a> </li> <li> <a href="img/numbers-05.jpg"> <img src="img/numbers-05.jpg" alt=""> <p>16oz. Mason Mug</p> </a> </li> <li> <a href="img/numbers-09.jpg"> <img src="img/numbers-09.jpg" alt=""> <p>24 oz h2Go Aluminum Classic</p> </a> </li> </ul> </section>

Ricky Catron
Ricky Catron
13,023 Points
Ricky Catron
Ricky Catron
13,023 Points

Can you post your CSS as well? That is where everything should have its size declared.

5 Answers

Shawn Denham
seal-mask
PLUS
.a{fill-rule:evenodd;}techdegree
Shawn Denham
Python Development Techdegree Student 17,801 Points
Shawn Denham
.a{fill-rule:evenodd;}techdegree
Shawn Denham
Python Development Techdegree Student 17,801 Points

If I understand your question correctly you can do it one of two ways. Via the HTML tag or Via CSS. CSS would be the preferred way since you can change the size of all of the images in one place.

The HTML way:

<a href="img/numbers-06.jpg">
<img src="img/numbers-06.jpg" alt="" height="200px" width="200px">
<p>Moleskin Large Hardcover Notebook</p>
</a>

The CSS way:

img {
    height: 200px;
    width: 200px;
}
Shawn Denham
seal-mask
PLUS
.a{fill-rule:evenodd;}techdegree
Shawn Denham
Python Development Techdegree Student 17,801 Points
Shawn Denham
.a{fill-rule:evenodd;}techdegree
Shawn Denham
Python Development Techdegree Student 17,801 Points

Ricky Catron If I remember right there is no CSS on this lesson. I think he is just wanting to know how to size the images....I could be wrong though!

Ricky Catron
Ricky Catron
13,023 Points
Ricky Catron
Ricky Catron
13,023 Points

Ahh Thank you! Been a while since I reviewed HTML. Great answer by the way.

Goodluck! --Ricky

Tony Brown
PLUS
Tony Brown
Courses Plus Student 1,134 Points
Tony Brown
Tony Brown
Courses Plus Student 1,134 Points

My CSS is what i think i need to change the colored square with my paragraph information is not matching up on each of my images. the images are sized corectly, its just the text beneath them and the space given for each description.

Tony Brown
PLUS
Tony Brown
Courses Plus Student 1,134 Points
Tony Brown
Tony Brown
Courses Plus Student 1,134 Points

Here is my CSS

/*********************************** PAGE: PORTFOLIO ************************************/

gallery {

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

gallery li {

float: left; width: 45%; margin: 1.5%; background-color: #FF8000; color: #0B0B61; }

gallery li a p {

margin: 0;
padding: 5%;
font-size:1.05em;
color: #585858

}

Shawn Denham
seal-mask
PLUS
.a{fill-rule:evenodd;}techdegree
Shawn Denham
Python Development Techdegree Student 17,801 Points
Shawn Denham
.a{fill-rule:evenodd;}techdegree
Shawn Denham
Python Development Techdegree Student 17,801 Points

You have no styling on your image tags.

you can go at by trying to style the anchor tag or list item tags but really the easiest solution is just to style the img tags.