[resolved] How to align logo and social media icon in header (5 posts)

  1. littlebizonline
    Posted 2 years ago #

    I am trying to align the site logo (left) and social media icons (right) on the same level horizontally. At the moment I have figured out how to place the social media icon either higher or lower than the website logo by moving the code for the social media icon before or after the logo code in the header.php file.

    It also seems that I can get the social media icon to the right of the screen (where I want it) in Chrome, but it appears on the left in IE. Really weird. Any advice here would also be appreciated.

    I am using a Twenty Twelve child theme.
    Website is http://www.bemorenow.net/evolution/


  2. vtxyzzy
    Posted 2 years ago #

    Try adding this to the end of your child theme's style.css:

    hgroup { width: 80%; float: left; }
    #header_icons { position: static; float: right: }
  3. littlebizonline
    Posted 2 years ago #

    Thanks vtxyzzy - that worked perfectly.
    However, I now have no padding under the website tagline before the navigation menu. Could you please suggest how I could have this match the spacing above the logo by adding to the child theme style.css?


  4. vtxyzzy
    Posted 2 years ago #

    You can add a bottom margin to the tagline:

    .site-header h2 {
        margin-bottom: 10px;
  5. littlebizonline
    Posted 2 years ago #

    Awesome - thank you again for your help :)

Topic Closed

This topic has been closed to new replies.

About this Topic