Margins/Padding Between Wrap Elements

rlucas1060

Hello,

If you'll notice all the wraps on the page have borders around them. I'm looking to create some separation on all sides between wraps. When looking at the page on a desktop, you'll see the two borders touch at the sides and top/bottom. And when looking at it on mobile, since the columns stack, they touch at the top/bottom.

https://www.kb.jniplants.com/introductions/

If it makes a difference, I have a custom class applied to the wraps.

/* Wrap border for products */

.wrapproductborder { 

border: 1px solid #bababa;

border-style: solid !important;

border-radius: 5px;

background: #ffffff;

}

Thank you,

Bryan

Hi,
okay we see but what would you like us to do with it?
You would be better off adding the borders to columns, not to wraps.
thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

rlucas1060

I'm not sure I understand. There are 3 columns "wraps" within the parent section. I included a screen shot. I'm just looking to create some separation between the bordered products. Any advice is appreciated.

Bryan

You cannot add spaces to wraps, it is not possible.
Like we said, if you want to do this with spaces then you need to place thos items using shortcodes in a column, not  wrap.
Then when you add padding to the wrap it will shrink the column and the space will be created.
Also add the border to the column, not the wrp.
thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next