Remove Right Indention of Social Icons


#1

Dear All,

Can you pls help me remove the indention to the right of the social media icons.

I think it is there by default.

website is www.rich.ph.

And also, pls change the default color of the icon logos to white.

Thank you.


#2

Hello there,

Try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.

    .footer-widgets ul.social-menu-widget {
      margin-left: 0;
    }

    .footer-widgets ul.social-menu-widget a {
      color: #fff;
    }

Regards,
Kharis


#3

Wow. It worked as magic. Thank you!!! You are a huge help for me and the community.

Also, Can I make the icon size of the social media at par with the icon size of the “Get In Touch” icons in the footer. Or even making them little smaller would be good?

Also, I noticed that the aTheme:Post element is touching the edges of the mobile screen in the mobile view. Can we do something so as not to make it touch the screen?


#4

Try adding the below extra CSS code:

    .footer-widgets .social-menu-widget li {
      padding: 5px 10px;
      height: auto;
      width: auto;
      line-height: inherit;
    }

    .footer-widgets .social-menu-widget a:before {
      font-size: inherit;
    }

Try adding this CSS code:

    @media only screen and (max-width: 460px) {
      .elementor-widget-athemes-posts .blog-post {
        margin-left: 20px;
        margin-right: 20px;
      }
      .elementor-widget-athemes-posts .owl-wrapper {
        width: auto !important;
      }
    }

Regards,
Kharis


#5

Thank you Kharis. The social media widget is now very fine.

For the ATheme:Post, if you can see in the mobile view (at least iPhone 6s) that the left margin is now ok, but the right part is still touching the screen edges. Can you do something about it?

Big thanks.


#6

Try adding this CSS code:

    @media only screen and (max-width: 460px) {

      .elementor-widget-athemes-posts {
        padding-left: 15px;
        padding-right: 15px;
      }
      
      .elementor-widget-athemes-posts .latest-news-wrapper,
      .elementor-widget-athemes-posts .owl-wrapper {
        max-width: 100% !important;
      }

      .elementor-widget-athemes-posts .blog-post {
        margin-left: 0;
        margin-right: 0;
      }
      
    }

Regards,
Kharis