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 Creating HTML Content Build the Footer

Robbin Arcega
seal-mask
.a{fill-rule:evenodd;}techdegree
Robbin Arcega
Front End Web Development Techdegree Student 1,369 Points

A weird underscore shows up between FB and Twitter icons

It's more of a question of why it happens - I figured out how to remove it, but it's still odd. I'd appreciate an answer for my own curiosity.

My code originally had a lot more spacing. I was formatting it the same way the instructor has been mentioning - nesting everything.

<a href="http://twitter.com">
  <img src="img/twitter-wrap.png" alt="">
</a>
<a href="http://facebook.com">
   <img src="img/facebookwrap.png" alt="">
</a>

But when I did that, I got an odd underscore. When I put everything on one line instead of nesting it....

<a href="http://twitter.com"><img src="img/twitter-wrap.png" alt=""></a>
<a href="http://facebook.com"><img src="img/facebookwrap.png" alt=""></a>

Voila! Underscore gone. But why did the spacing even make a difference, and what other sorts of mayhem could my spacing cause in the future?

1 Answer

Idan Melamed
Idan Melamed
16,285 Points

Hi Robbin,

The underline was created because of the spaces between the <img> tag and the </a> tag. For more information check this out: http://stackoverflow.com/questions/9003969/underscore-between-two-image-links