Hey ,
I’ve put together a CSS snippet which will achieve this for you. Could you add the following to the plugin’s Custom CSS section, which is on the plugin’s Customize page, and let me know whether it does that for you:
@media(max-width: 600px){
#sb_instagram #sbi_images .sbi_item{ display: none; }
#sb_instagram #sbi_images .sbi_item:nth-child(-n+6){ display: inline-block; }
#sb_instagram #sbi_images .sbi_item { width: 33% !important; }
}
I’ve tested this on a test site of mine and it displays 3 columns/2 rows on mobile.
Let me know if that works, and I hope you’re having a good day!
John
It works perfectly!!
Thank you so much! 🙂
You’re very welcome 🙂
No obligation, but if you like the plugin and support you received would you consider leaving a really quick review? It really helps to support the ongoing development of the plugin!
If you have any other questions then just let me know, and I hope you’re having a good week.
John
Thant’s brilliant.
I wanted nine (3×3)so I changed it to:
@media(max-width: 600px){
#sb_instagram #sbi_images .sbi_item{ display: none; }
#sb_instagram #sbi_images .sbi_item:nth-child(-n+9){ display: inline-block; }
#sb_instagram #sbi_images .sbi_item { width: 33% !important; }
}
Awesome, happy to hear it came in handy for you too 🙂
John
