Hi,

I built a website with social media links which are within a Wordpress widget. The 'links' are at the top left of this home page theoldstationnursery.co.uk. But they don't link! I keep looking back at the code in my widget thinking that the syntax must be wrong, but I can't see the error. This is my code:

<div id="social-links">
<ul>
<li class="link-facebook"><a href="http://www.facebook.com/pages/The-Old-Station-Nursery-Group/138568469498327/ ">follow us on facebook</a></li>
<li class="link-instagram"><a href="http://instagram.com/oldstationnursery#/ ">follow us on instagram</a></li>
</ul>
</div>

If anyone has a suggestion of where I may have gone wrong, I'd be really grateful!

Vicky

To extend on what NOCK has suggested - you should apply the text-indent to your <a></a> tags and give them auto width and height.

 

It's funny, because I used to pass this nursery each morning on my way to College.

Hi Nock and jakdothtml

Many thanks for your responses - I really appreciate you taking the time to look at this for me. I needed to keep the background image within the css so I could control it better on the mobile versions. I followed the advice here about a newer technique for image replacement: http://www.sitepoint.com/new-css-image-replacement-technique/ and I also added an a:link rule to both items:

#social-links ul li.link-facebook a{
	display:block;
	height:100%;}

I'm yet to test it across the board, but it seems to be working so far.

Many thanks again for your time. Funny that you're so local to the nursery jakdothtml!

Vicky