dainasaurroar

Actually – scratch that. it’s working!

Thank you!

Hi – unfortunately it is still not working. I’m wondering if I should hide the plugin after a certain break point?

This is all the css I have in the sb settings in case this helps?

#sb_instagram .sbi_follow_btn {
display: -moz-inline-stack;
display: inline-block;
vertical-align: top;
zoom: 1;
text-align: center;
padding-bottom: 30px;
padding-top: 15px;
font-weight: normal;
font-style: normal;
text-transform: uppercase;
text-decoration: none;
letter-spacing: 2px
}

.sbi_follow_btn {
background: #f8f8f8;
color: #ababab;
}

#sbi_load {
padding-top: 0px !important;
}

@media(max-width: 600px){
#sb_instagram #sbi_images .sbi_item{ display: none; }
#sb_instagram #sbi_images .sbi_item:nth-child(-n+4){ display: inline-block; }
}

@media only screen and ( min-width: 480px ) and ( max-width: 700px ) {
#sb_instagram.sbi_col_9 #sbi_images .sbi_item {
width: 25%;
padding: 0!important;
}
#sb_instagram.sbi_col_9 #sbi_images .sbi_item:nth-child(n+5) {
display:none !important;
}
}

@media only screen and ( min-width: 600px ) {
footer .footer-widget:nth-child(n) {
width: 100% !important;
padding: 0!important;
}
}

@media (max-width: 980px) {
#footer-widgets {
padding: 0%!important;
}
}

@media (max-width: 767px) {
#footer-widgets {
padding: 0%!important;
}
}

@media (max-width: 479px) {
footer #footer-widgets .footer-widget:nth-child(n) {
margin-bottom: 0 !important;
}
}

This is the custom css I have in my child theme style sheet:

/* bottom elements padding */
.bottom-nav {
padding-left: 30px;
}

@media (min-width: 981px) {
.et_pb_gutters2 .footer-widget {
margin: 0 !important;
}
}

@media only screen and ( min-width: 480px ) and ( max-width: 700px ) {
{
.et_pb_gutters2 .footer-widget {
margin: 0 !important;
}
}

@media only screen and ( min-width: 600px ) {
{
.et_pb_gutters2 .footer-widget {
margin: 0 !important;
}
}

#menu-footer {
width: 100%!important;
}

/*additional instagram padding*/
@media (max-width: 980px) {
#footer-widgets {
padding: 0%!important;
}
}

@media (max-width: 767px) {
#footer-widgets {
padding: 0%!important;
}
}

@media (max-width: 479px) {
#footer-widgets {
padding: 0%!important;
}
}

Thanks for the quick response!

For some reason it’s not working for me and I still get the padding or margin under the plugin area when viewing on mobile and portrait mode on tablet. ??

That did it! thank you!

Hi John!

i must have been looking at code for too long last night. Thanks for the help, that worked ??

I figured out that it was the css of the theme footer widget.

Hi Rene, thanks for the response!

On my production version of the site I get a 404 not find error, however in the staging version I am using a different theme. When I load the dev tools in the staging version I get this error: Failed to load resource: the server responded with a status of 404 (Not Found). So it seems it may be a hard coded path? My current theme is Hemlock by solo pine. My staging theme is the most recent Divi theme by elegant themes.

I had the same issue with the oEmbed Instagram plugin. I ended up being able to not have to use a plugin and just wrapped the link in [embed]instagramlinkgoeshere[/embed].

Hope this helps!

Yes! That’s it. Thanks so much! I ended up having to wrap the instagram link in the [embed]…[/embed] code. But, the video seems to be working. Taking the actual linked above post down for now until I am ready to post it with the right instagram video in a few hours.