Need to move social media icons in footer to centre

  • thesightinthestorm · Member ·

    Hello to all you CSS legends,
    Could you please help me move the social media icons at the bottom of the page to centre. They are centred in iPad and iPhone view but not in fullscreen.

    The blog I need help with is: (visible only to logged in users)

  • kathrynwp · Staff ·

    Hi there – this should do it:

    .social-links {
  float: none;
  text-align: center;
}
.site-info {
  float: none;
  text-align: center;
  max-width: inherit;
  margin-bottom: 10px;
}

    I’ve centered your footer credit as well on its own line, otherwise it bumps into the social menu, making it look off-centre.

    Let me know how it goes.

  • thesightinthestorm · Member ·

    Hi Kathryn, thanks so much for your response! In full screen view, the icons have moved to the left side of the page but again is fully centred on the others. Also is it possible to move the credits below the icons? Thanks so much in advance

  • kathrynwp · Staff ·

    How odd – I think something got dropped inadvertently when I copied over the code from my test site.

    Try this instead – it also moves the footer credit to the bottom of the page:

    .social-links {
  float: none;
  max-width: inherit;
  text-align: center;
  margin-bottom: 10px;
}
.site-info {
  bottom: 0px;
  margin-bottom: 10px;
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%)
}
  • thesightinthestorm · Member ·

    That did it. Thank you so much for your help Kathryn. :)

  • kathrynwp · Staff ·

    You’re welcome! I’ll mark this thread as resolved but feel free to start a new one if you need help with anything else.

  • The topic ‘Need to move social media icons in footer to centre’ is closed to new replies.