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 The Selectors Solution

Posted by B.B. Groeneveld
B.B. Groeneveld
2,826 Points

how come my .main-img doesn't have the same image size as in the video?

how come my .main-img doesn't have the same image size as in the video? Here I have my code:

/* Give the 'img' tag in the header an ID and set its width to 190px */

#header-img {
  width:190px;
}

And I get small image on the left of the page. I checked the programmer tools in Chrome, and it shows 190px. But still, it's not what Guil has on it's screen. Anyone advice?

1 Answer

Kyle Hartigan
Kyle Hartigan
16,967 Points

Assuming you added this to the html on line 16:

<img id="site-logo" src="logo.png" alt="Bookworm">

You have the correct answer with your CSS. Make sure you didnt select the image anywhere else in your CSS to manipulate it.

I was able to recreate this and my image appeared perfectly fine in Mozilla Developer Browser.

Clear your cache, try another browser, check your CSS for other that could be effecting your image.

What is the height of your image? Mine is 25.7px

B.B. Groeneveld
B.B. Groeneveld
2,826 Points

Hi, thanks for showing me the solution, much appreciated.

It seems I haven't set the ID on line 16, had the wrong target name in the css than the class name in my html.index. So now I've given them the same name and put the ID on line 16 and I have the right image size and position. The height of the image is now 25.7.