How to add social media buttons to the header. (5 posts)

  1. petergood
    Posted 2 years ago #

    I have got a problem, because I am trying to add social media buttons on my website. But every tutorial I follow, the buttons are always aligned to the left, and not to the right. You can see what I mean, by visiting PG-Technology.pl I want the buttons in the header, to be aligned to the right, and not to the left. You can look at my CSS and HTML code:

    header.php (inside the container section)

    <div id="header_icons">
    <a href="https://www.facebook.com/your_social_media_URL" target="_blank">
    <img alt="" src="http://url_of_facebook_icon" width="40px" /></a>
    <a href="http://www.linkedin.com/profile/your_social_media_URL" target="_blank">
    <img alt="" src="http://url_of_linkedin_icon" width="40px" /></a>
    <a href="http://your_website_feed_address/feed" target="_blank"><img alt="" src=”http://url_of_feed_icon" width="40px" /></a>


    #header_icons {
    position: absolute;
    margin-top: 5%;
    z-index: 1;
  2. Andrew
    Bawk bawk moderator
    Posted 2 years ago #

    If that PG-Technology link is a link to your blog then please fix is, we need to see the issue you are experiencing.

    BTW if you're using absolute positioning you can scrap using "margin"s and use position properties instead (top, bottom, right, left).

  3. petergood
    Posted 2 years ago #

    Hi Andrew!
    Thanks for leaving a reply in my topic :) The site must be down in Your region, because I changed the dns servers, and it takes some time to get going :) But, I will give You a screen shot: http://scr.hu/1qbw/ufhnu
    You will notice, that the buttons, are above the logo, I want them to be next to the logo, on the right side ;) The method You posted above doesn`t work :(

    Thanks ;)

  4. Andrew
    Bawk bawk moderator
    Posted 2 years ago #

    Your social icons are inside the header? If so, give your header a position of relative.

    Sorry, but I can't help from a screenshot.

  5. petergood
    Posted 2 years ago #

    Thanks for the tip ;)
    Sorry, but it still doesn`t work :( You can view my webpage at: http://pg-technology.veed.eu/ ;)

    Have you got any other ideas? :)

Topic Closed

This topic has been closed to new replies.

About this Topic