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
Angel Vicioso
895 PointsIam having an issue where the social media icons in the footer won't downsize with .social icon class
i tried to downsize the social icons with .social icon class and the won't resize despite no visible errors in the html or the css ive tried refreshing as well but that didnt work either
here is my code : html <a href="https://www.facebook.com/angel.vicioso.1"><img src="image/facebook-wrap.png" alt="image/facebook.png" class="social-icon"></a> <a href="https://twitter.com/KingofBanditsXI"><img src="image/twitter-wrap.png"alt="image/twitter.png" class="social-icon"></a>
CSS .social-icon { width: 20px; height: 20px; margin: 0 5px; }
1 Answer
Patrick Kelly
6,200 PointsHi Angel,
Whilst HTML and CSS can be quite easy to grasp, they can be a trouble to debug when you get any problems with them (as I'm sure you've found with this case!).
It sounds to me like your rule which you're applying to .social-icon might be getting overwritten by a more 'imporant' rule, which could be done by targeting the <img> element itself or (although it would seem not in this case) using an ID intead.
Unfortunately classes fall quite far down the priority listing in terms of style inheritance in CSS, so for instance if an element is styled using an id (#), it will (usually) override any CSS styling applied by any classes (unless any of the rule for those classes use !important).
If you're using Firefox to inspect your elements as you're coding, you should be able to see if any of you CSS rules are being overridden as they'll appear with a line through them.
I hope this helps!
Best, Patrick