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 CSS Basics (2014) Getting Started with CSS Intro to CSS Review

Miguel Nunez
Miguel Nunez
3,266 Points
Posted by Miguel Nunez
Miguel Nunez
3,266 Points

How can I target different images in css I tried the id selector even the class selector they don't work with images

Show me examples of your method that you use to target each image on a page with different sizes width,height etc.

2 Answers

Tracy Excell
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Tracy Excell
Front End Web Development Techdegree Graduate 15,333 Points
Tracy Excell
.a{fill-rule:evenodd;}techdegree seal-36
Tracy Excell
Front End Web Development Techdegree Graduate 15,333 Points

This is how I add classes to an image in the html

<div id="photo-container"> <ul id="imageGallery"> <li><a href="Photos/01.jpg"><img src="Photos/01.jpg" alt="photo of a dry hill" class="photo"></a></li>

        <li><a href="Photos/02.jpg"><img src="Photos/02.jpg" alt="photo of a blue lake" class="photo"></a></li>

        <li><a href="Photos/10.jpg"><img src="Photos/10.jpg" alt="photo of an ocean at dusk" class="photo"></a></li>   
     </ul>
        </div><!--closing photo-container-->

then to style it you select it in the css file e.g

.photo { height: 100px; width:100px; }

Hope that helps

Miguel Nunez
Miguel Nunez
3,266 Points
Miguel Nunez
Miguel Nunez
3,266 Points

Thanks that really helped out.

Belve Marks
Belve Marks
7,332 Points
Belve Marks
Belve Marks
7,332 Points

How are you trying to style them? I had some real problems working with images until I realized their relationship to the container they are in.... They are probably being targeted, but either: there's a syntax error in the CSS or the code isn't styling the way you might expect. Use developer tools if you can.

Can you post your code for us to look at?

Miguel Nunez
Miguel Nunez
3,266 Points
Miguel Nunez
Miguel Nunez
3,266 Points

For some reason when I paste the code here it looks all damage so I posted this in a text document heres the link https://docs.google.com/document/d/1C467j0Zey3qn5pj-T-1wY2zGcKx2FPdRvnTVGPaxKH4/edit

and I tested different ways of what I saw in you tube videos and still no luck to find a effective method that I can use with multiple images.