Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS How to Make a Website Adding Pages to a Website Make an About Page

img and css

We are working on adjusting the about.html page. I had to change the display to block on the profile image in css. Can someone remind me why that doesn't affect other images on my main html page since they are using the same css page?

Hi Berenice,

If you post the CSS and HTML documents you're asking about, it would make it much easier for others to answer your question appropriately.

3 Answers

lordcozycat
lordcozycat
11,940 Points

In this case, Berenice, you're changing the image with the class "profile-image" to display as "block".

.profile-image {
    display: block;
}

This won't effect any other images on your page because you've specifically selected the image with the class.

Bryan, I thought that should be the case as well, which is why I got confused for the question of "Select the image and set it to be a block element" I went to the css file and I did:

.profile-photo { display: block; }

and it did not work, but when I add the block element to :

img { display: block; }

it said that was correct. So then I got confused with the idea that all my html pages are using the same css page, wouldn't doing it the img { display: block; } way, change the setting on all my photos through out all my html pages?

Adam Moore
Adam Moore
21,956 Points

If you are using the same CSS page for all of your HTML pages, then yes, it would change them. However, it could be for a few reasons: 1) Your other images may be needing to be set to display: block (or already are set), in which case they would need to generalize to all images; 2) All other images are set with their own more precise selector, in which case setting a generic img { display: block; } wouldn't override each image's more-specific styles; or 3) They are just making you do it in the code challenge to check to see that you understand how to do it, and therefore may not actually matter for the actual production of all of the HTML pages being styled by the one single CSS sheet. There may be other reasons for setting this general image styling, but I can't think of any right off the top of my head.

gotcha! : ] Thank you!