Social icons positioning

  • Resolved Daniel P.

    (@danidub)


    5 years, 1 month ago

    Hello, I have added 3 social icons and the spacing seems really weird, all icons are separated too much. After inspecting the code I discovered that the icons are positioning on a table. Wouldn’t be better to use something like CSS Display Flex?
    And let the user position the icons centered, left or right aligned?

    Maybe another idea to achieve what we want? I have attached a screenshot showing the actual output of the plugin and our desired output. Thank you. Apart from this little detail your plugin rocks!

    https://prnt.sc/12h4zwe

    Thank you.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Contributor Ben Ritner – Kadence WP

    (@britner)

    5 years ago

    Hey,
    Thanks for your feedback, You asked:

    Wouldn’t be better to use something like CSS Display Flex?

    And the answer is no. The reason is that emails are not treated the same as the general web and browser support. Emails are like having to support IE8 the inbox version being outlook. Email HTML and css is not the same rules as browsers and the general web.

    You are certainly welcome to add your own css however and edit the emails any way you want.

    If you want to center the additional text added by woocommerce core you can use custom styling like this:

    #body_content_inner p:last-child {
    text-align: center;
}

    For the social icons you can center using css like this in your custom styles box:

    #footersocial {
    max-width: 300px;
    margin: 0 auto;
}

    Ben

    Thread Starter Daniel P.

    (@danidub)

    5 years ago

    Great answer @britner. Thank you for your comments and snippet 💪

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

The topic ‘Social icons positioning’ is closed to new replies.