WordPress.org

Support

Support » How-To and Troubleshooting » [Resolved] What are these tiny blue lines that act as links?

[Resolved] What are these tiny blue lines that act as links?

  • So I am working on this site: http://www.newhomelaunch.org/
    I tried to place social media icons above the header.

    The code I used was:

    Into header.php:

    <div id="header_icons">
    
    <ul>
    <li><a href="http://www.twitter.com"><img src="http://www.newhomelaunch.org/wp-content/uploads/2012/10/Twitter-e1349302275170.png" /></a></li>
    <li><a href="http://www.youtube.com"><img src="http://www.newhomelaunch.org/wp-content/uploads/2012/10/Youtube-e1349301570811.png" /></a></li>
    <li><a href="http://www.newhomelaunch.org/feed/"><img src="http://www.newhomelaunch.org/wp-content/uploads/2012/10/Rss-e1349302295961.png" /></a></li>
    </ul>
    </div>

    Into css:

    #header_icons li{
    display:inline;
    position: relative;
    top: 5;
    right: 0;
    left: 1000;
    bottom: 5;
    }

    That worked okay, like it put stuff where I want it and they work, however, there are now those two little blue lines on the left. One links to youtube, and the other to twitter.

    Any help would be appreciated. Is there a better way to do what I want? I don’t want to resize the header. I want to place either above the header or over it.

Viewing 6 replies - 1 through 6 (of 6 total)
  • Moderator Andrew Nevins

    @anevins

    Forum moderator

    They’re stray anchor tags that hold no image and aren’t within the list structure.

    <div id="header_icons">
    
    <ul>
    <li>
     <a href="http://www.twitter.com"><img src="http://www.newhomelaunch.org/wp-content/uploads/2012/10/Twitter-e1349302275170.png" />
     </a>
    </li>
    <li>
     <a href="http://www.youtube.com"><img src="http://www.newhomelaunch.org/wp-content/uploads/2012/10/Youtube-e1349301570811.png" />
     </a>
    </li>
    <li>
     <a href="http://www.newhomelaunch.org/feed/"><img src="http://www.newhomelaunch.org/wp-content/uploads/2012/10/Rss-e1349302295961.png" />
     </a>
    </li>
    </ul>
    </div>

    As you can see in your code, you’ve closed off the anchor tag (/>) then applied another closing anchor tag element (</a>). This could be causing the issue.

    Aha! Thank you sir. That indeed was the problem. Now it is fixed. Thanks again!

    Oh wait! I was too quick. I just noticed when I changed it, it forced the “about us” on the menu down. Did I not change the code correctly? I just eliminated the />

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    When eliminating the /> you need to replace it with > so you’re just taking away the forward slash.

    Oh, that’s what it was. Thanks, I think it is good now.

    Resolved

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘[Resolved] What are these tiny blue lines that act as links?’ is closed to new replies.