Footer Widget Alignment

Home › Forums › Jevelin Theme › Footer Widget Alignment

Home › Forums › Jevelin Theme › Footer Widget Alignment

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    RESOLVED Posts

  • SarahL
    Participant

    I have a 3 column footer that I’m trying to style. Column 1 I have the Shufflehound Contact Widget, Column 2 has the logo, Column 3 has links to our privacy policy, about us & copyright date. The issue is with alignment of each column. Shufflehound Contacts defaults to a left justified. Since I used the custom HTML widget for the logo and links, I can make them center justified. When I try to add style alignment to the Shufflehound by using <p style=”text-align: center;”> in the widget field it only adjusts the text and leaves the icon left justified. Plus, when I view the footer in a medium size screen (tablet preview) it has the contact info to the left and everything else centers. How do I get the Shufflehound Contacts widget to fall in line?

    Attachments:
    You must be logged in to view attached files.

    Shufflehound Support
    Moderator

    Solution for this topic

    Hi @SarahL,

     

    I hope you are well today and thank you for your question.

     

    You can achieve it by adding the following CSS code in the Custom CSS code option of your theme on the below path.

     

    Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code

     

    @media (min-width: 900px){
.sh-footer-columns > .widget-item.widget_social_links .sh-contacts-widget-item {
    float: right;
    clear: both;
}
}

@media (max-width: 900px){
.sh-footer-columns > .widget-item.widget_social_links {
    display: table;
    margin: 0 auto;
    float: none;
    width: auto !important;
    }
}

     

    Best regards,
    Shufflehound team

    SarahL
    Participant

    Perfect! Thanks.

    Shufflehound Support
    Moderator

    You are most welcome here 🙂

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)