How to center 1, 2 or 4 ShopIsle frontpage Banners per row
Important notice: This product is now in maintenance mode and is no longer being actively developed or supported. Updates and bug fixes will not be provided unless they relate to security concerns.
First install our CSS plugin: Click Here
Go to Appearance->Customize->Advanced CSS Editor
To have 1 centered banner per row add the following snippet of CSS to the Desktop and Tablet CSS area:
.shop_isle_bannerss_section .col-sm-4 { width: 100%; }
To have 2 centered banners per row add the following snippet of CSS to the Desktop and Tablet CSS area:
.shop_isle_bannerss_section .col-sm-4 { width: 50%; }
To have 4 centered banners per row add the following snippet of CSS to the Desktop and Tablet CSS area:
.shop_isle_bannerss_section .col-sm-4 { width: 25%; }
Now save your changes.
If you are using another CSS plugin such as Simple Custom CSS or via your child theme style.css/custom.css then you could use a media query with the snippet which will cover both tablets and desktops like this ( it will center two banners, change the % to 100 for 1 banner):
@media screen and (min-width: 768px){ .shop_isle_bannerss_section .col-sm-4 { width: 50%; } }