Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #20728
    Nancy
    Participant

    Social Icons turned on for the footer. How do I align the icons with the text in the footer? I’d like them centered vertically in the space. My test site is below:

    http://ipcrew.com/testsite/

    #20741
    Sakin
    Keymaster

    @Nancy: You can add the following CSS in “Appearance => Theme Options => Custom CSS” box.
    #site-generator .copyright { clear: none; }

    #21104
    Nancy
    Participant

    Added #site-generator .powered { clear: none; } to try to align the .powered text but it didn’t work the same as the .copyright CSS you gave me before.

    http://www.ipcrew.com/SHSTest/

    #21119
    Sakin
    Keymaster

    @Nancy: I don’t get it what you want do with this site. You can simply remove the social icon from Footer though “Appearance => Theme Options => Social Icons” and uncheck Enable Social Icons in Footer.

    #21122
    Nancy
    Participant

    I am trying to align all the text and also the social media icons in the footer. The text in the .powered by division shows up lower than the other text & the icons. I may just remove the icons and not worry about it.

    #21127
    Sakin
    Keymaster

    @Nancy: That is because when you add social icon in footer. It will push copyright down. Can you share screenshot of what you want. Then I can suggest you the css.

    #21131
    Nancy
    Participant

    Here’s a screen shot.

    http://www.ipcrew.com/SHSTest/wp-content/uploads/2014/03/footer.jpg

    Basically, I would like the all the text and the image to have their tops aligned. With only the copyright text, custom CSS of: #site-generator .copyright { clear: none; } worked great.

    This is what I currently have in the footer:

    <div class=”powered”> Copyright © [the-year] [site-link]. All Rights Reserved.
    </br>Legal Notice </div>

    <div class=”copyright”>Sacred Heart School
    </br>9450 NE 14th Street – Bellevue, WA 98004
    </br>School Office (425) 451-1773</div>

    #21144
    Sakin
    Keymaster

    @Nancy: After you added social icon and text in the right. The Copyright information width is not enough so it floated below. You can try adding in the following CSS in “Appearance => Theme Options => Custom CSS” box.

    @media screen and (min-width: 769px) {
    #site-generator .copyright { width: 40%; }
    }
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Centering Social Icons with Footer Text’ is closed to new replies.