Social Media Icons Not Showing In Header Image

  • Resolved Alan Wood

    (@gwmacosx)


    9 years, 11 months ago

    Hi, this is only happening on the desktop version of my site. The social media icons are working on mobile. https://gwmac.com

    Here is what I have tried so far but it isn’t working.

    }
    .header-social a.header-facebook {
    background: #598347 none repeat scroll 0 0;
    }
    .header-social a.header-twitter {
    background: #983473 none repeat scroll 0 0;
    }
    .header-social a.header-money {
    background: #984733 none repeat scroll 0 0;
    }
    .header-social a.header-shopping-cart {
    background: #873422 none repeat scroll 0 0;
    }
    .header-social a.header-rss-square {
    background: #978344 none repeat scroll 0 0;
    }
    .header-social a.header-bookmark {
    background: #283622 none repeat scroll 0 0;
    }

    I would be grateful if someone can tell me what I am doing wrong. Today I made a larger and wider header image. The search box in the upper right corner works fine but can’t seem to get the social media to appear in the upper left corner of image.

    One other issue is the blank white space below the header image is unnecessary. Any way to reduce that blank area between the image and where it turns grey? Thanks

Viewing 5 replies - 1 through 5 (of 5 total)

  • Seems to be the absolute position here:

    .header-social {
    display: inline-block;
    float: left;
    left: 0;
    margin-bottom: 46px;
    margin-top: 44px;
    position: absolute;
    top: 0;
}

    Thread Starter Alan Wood

    (@gwmacosx)

    Thanks for your help. I am a complete doofus when it comes to these things but I can follow instructions well. How would I correct that? My theme has a section for Custom CSS and someone else suggested that CSS I pasted above. Can you correct the code so I can copy and paste?

    I can either paste into my theme’s settings Custom CSS field or if you need me to go into the theme editor and change something there as well I can do that to. Just not sure what I need to change and where I need to change it. Thanks

    Thread Starter Alan Wood

    (@gwmacosx)

    I found what you were talking about in the stylesheet page. I will copy and paste that section and include the logo, search widgets as well.

    What changes can I make here to make them appear?

    [unnecessary code removed]

    No need to post CSS – I can see it all on your site.
    Try adding this to the custom CSS:

    .header-social {
    margin:10px;
    position: relative;
}

    Thread Starter Alan Wood

    (@gwmacosx)

    Thank you so much. That did the trick. They are appearing.

    I would prefer to have them inside my header image if possible, but at least they are there now.

    My search box moved also moved outside the header image. But at least I have an idea of what to do.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Social Media Icons Not Showing In Header Image’ is closed to new replies.