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

HTML How to Make a Website Adding Pages to a Website Add Iconography

Jonathan Castillo
PLUS
Jonathan Castillo
Courses Plus Student 836 Points
Posted by Jonathan Castillo
Jonathan Castillo
Courses Plus Student 836 Points

Display: block

Hello, I'm having trouble understanding the iconography or maybe am overthinking it but while adding the image to the anchor element why does the image push away from the text when you add padding to te left but when I add padding to the right nothing happens.

2 Answers

Chris Jardine
Chris Jardine
13,299 Points

Hi Jonathan

The icons are background images in the anchor tag and not in line with the text. So when he adds 30px padding to the left of the anchor tag, he's not adding the padding to the background image. This means the text will be pushed over 30px to the right. But the background image is not affected because it's in the background of the anchor tag.

I hope this makes sense.

Siddharth Nasare
Siddharth Nasare
15,636 Points
Siddharth Nasare
Siddharth Nasare
15,636 Points

If you are giving display: block property, then you won't have an access to padding or margin property. You neet to use display: inline-block property for that. Then you will allow using margin and padding. Try it!!!