Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Contributor Craig at Smash Balloon

    (@craig-at-smash-balloon)

    Hey featherandwind,

    It looks like your theme adds some padding to widgets that changes as the screen gets smaller. You can try two things to fix this, the first would be to add a negative margin to the left of the feed to pull it back that way when the screen is small. To do this, go to the Settings page, “Customize” tab, and scroll down to the “Custom CSS” area and paste this in:

    @media all and (max-width: 480px){
      #sb_instagram {
        margin-left: -12.5px;
      }
    }

    You could also try setting the width of the feed to 100% instead of 240px. This would help the feed center automatically.

    Let me know if you have any questions about this!

    Thread Starter featherandthewind

    (@featherandthewind)

    First of all thanks very much for the quick response and amount of help..

    I did both – and changing to 100% works great!

    Only issue is the Instagram Header/Handle + Bio gets cut off on smaller devices.BUT I can live with that because all the images look perfect no matter how small the screen.

    If theres a quick css fix to fix that or a way to remove text altogether that would work too because I don’t really need it..

    Either way I’m happy thanks a lot.

    Plugin Contributor Craig at Smash Balloon

    (@craig-at-smash-balloon)

    Hello again,

    Glad it is looking better! I see what you mean with the header text being cut off. It looks like there is some padding that is responsible. You can remove it with javascript. Right below the “Custom CSS” area is a space for “Custom Javascript”. Try pasting this in:

    jQuery("#sb_instagram .sb_instagram_header").css('padding',0);

    Thread Starter featherandthewind

    (@featherandthewind)

    I do not have Custom Javascript tab… I access Custom Css from Appearance Tab. Nothing in customizer or settings…

    Plugin Contributor Craig at Smash Balloon

    (@craig-at-smash-balloon)

    Ahh sorry about that. I meant the Settings page for Instagram Feed. On the “Customize” tab we have a section for CSS and Javascript.

    I missed the part of your question that mentioned that you might want to remove the header altogether. We have an option for on this a little farther up the page from the Custom CSS and Javascript called “Show the Header” that you could just uncheck as well.

    Thread Starter featherandthewind

    (@featherandthewind)

    Great thanks so much!!

    Plugin Contributor Craig at Smash Balloon

    (@craig-at-smash-balloon)

    I’m glad we could get that working! No obligation of course, but if you like the plugin and feel like leaving a super-quick review then we always really appreciate it!

    Good luck to you on your travels!

    – Craig

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

The topic ‘Centering on Mobile Device’ is closed to new replies.