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.

HTML How to Make a Website Styling Web Pages and Navigation Polish the Navigation and Footer

Why is my code not making changes to width/height of my social media icons? It can only change the margin

Hi, I still have a problem with my code. I tried to follow Nick's code but my icon's are not budging with my codes. Only the margin seems to work. If I change the margin values to the footer icons, using the social-icon class in CSS, it does work and I can see the change when I refresh the page. But why is it that the width and height are not changing no matter what number I put into the value section? Is it the kind of image that I use? Or problem linking the class? Did I make a mistake in writing the code for the footer icon images in index.html, or the path? This is how I wrote it. } .social-icon { width: 20px; height: 20px; margin: 0 5px; } Attached is the screenshot of my code. Thank you.

https://w.trhou.se/cj4n84ifbk

2 Answers

Steven Parker
Steven Parker
221,902 Points

In the HTML, that class is applied to the link, not the image. To change the size of the image you would need to target the image itself in your CSS rule.

Yes!!! That did it. Thank you so so much!!!

KAMRAN IMRANLI
KAMRAN IMRANLI
4,107 Points

Steven Parker but the <img> is nested inside the <a> tags. Why don't they change?

Steven Parker
Steven Parker
221,902 Points

Some settings are inherited from the parent element, and some are not and must be applied directly to the target.