Grid Item space

[TBS2023]

Hello

I would like to add some spacing between my grid items

but when i do- the item falls back down a row

can you please help

https://thebodyshop.com.lb/pages/range

dosawr

[BSSCommerce-HDL · Accepted solution]

Hi @TBS2023, 

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Inside head tags. You need create style tags. After insert my code inside style tags

@media only screen and (min-width: 769px) {
    .medium-up--one-third {
        width: calc(33.33333% - 10px) !important;
        margin-left: 10px !important;
    }
}

Here is result: 

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

[Made4uo-Ribe]

Hi @TBS2023 

Check this one. 

From your Shopify admin dashboard, click on "Online Store" and then "Themes".

Find the theme that you want to edit and click on "Actions" and then "Edit code".

In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

@media only screen and (min-width: 769px) {
    .medium-up--one-third {
        padding: 0 5px;
    }
}

And Save. 

Result:

[Vinsinfo]

@TBS2023 Please follow the below steps to add some spacing between the grid items. Let me know whether it is helpful for you.

1. Go to "Online stores" -> "Themes".

2. Click action button from the current theme and select "Edit code".

3. Search "theme.css" file and paste below code at the bottom of the file like in the below attached screenshot.

NOTE: You can modify the value of the "padding-left" as per your need.

.grid.grid--uniform .grid__item {
  padding-left: 20px;
  width: 33%;
}

4. Final Result will be like,

Please provide your support by click "Like" and "Accepted" if our solution works for you. Thanks for your support.

[TBS2023]

Unfortunately nothing happened!