How can I decrease the gap between products in featured collection ? Impact theme

[Oguzsanci]

Basically i want just a little gap between products i cant seem to do that though.

Here's the link to the store 

[BSSCommerce-HDL · Accepted solution]

Hi @Oguzsanci, 

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

Step 2: Search file theme.liquid

Step 3: Insert this code above </head> tag: 

<style>
product-list.product-list product-card {
    width: auto !important;
}
</style>

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  😍

[BSS-TekLabs · Accepted solution]

- Here is the solution for you @Oguzsanci 
- Please follow these steps:

- Then find the base.css or theme.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

 

.product-list {
     gap: inherit !important;
}
.product-card {
     width: 92% !important;
}

- Here is the result you will achieve:

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

[niraj_patel · Accepted solution]

Hello @Oguzsanci 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
#shopify-section-template--22728085602626__featured_collection_dWUCtz product-card {
width: 100% !important;
}
</style>

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[BSSCommerce-HDL · Accepted solution]

Hi @Oguzsanci, 

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

Step 2: Search file theme.liquid

Step 3: Insert this code above </head> tag: 

<style>
product-list.product-list product-card {
    width: auto !important;
}
</style>

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  😍

[BSS-TekLabs · Accepted solution]

- Here is the solution for you @Oguzsanci 
- Please follow these steps:

- Then find the base.css or theme.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

 

.product-list {
     gap: inherit !important;
}
.product-card {
     width: 92% !important;
}

- Here is the result you will achieve:

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

[niraj_patel · Accepted solution]

Hello @Oguzsanci 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
#shopify-section-template--22728085602626__featured_collection_dWUCtz product-card {
width: 100% !important;
}
</style>

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[oscprofessional · Accepted solution]

Hi @Oguzsanci 

Add the css code at the end in theme.css file 
Go to online store > themes > actions > edit code >theme.css

product-card.product-card {
width: 100%;
}

[Oguzsanci]

thank you for everyone that replied all were excellent solutions ❤️