Centering on Mobile Device
-
On small devices the right side of feed disappears.
Is there a way to just centre the feed??
I think it would fix all my problems
featherandthewind.com
-
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!
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.
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);I do not have Custom Javascript tab… I access Custom Css from Appearance Tab. Nothing in customizer or settings…
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.
Great thanks so much!!
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
The topic ‘Centering on Mobile Device’ is closed to new replies.