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
Tony Brown
Courses Plus Student 1,134 Pointshow 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>
5 Answers
Shawn Denham
Python Development Techdegree Student 17,802 PointsIf 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
Python Development Techdegree Student 17,802 PointsRicky 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
13,023 PointsAhh Thank you! Been a while since I reviewed HTML. Great answer by the way.
Goodluck! --Ricky
Tony Brown
Courses Plus Student 1,134 PointsMy 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
Courses Plus Student 1,134 PointsHere 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
Python Development Techdegree Student 17,802 PointsYou 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.
Ricky Catron
13,023 PointsRicky Catron
13,023 PointsCan you post your CSS as well? That is where everything should have its size declared.