Width of virticle filter... (Dawn Theme)

Solved

Width of virticle filter... (Dawn Theme)

larsvilhelmsson
Excursionist
24 0 8

Hi all, 

 

I have a massive issue that I've been trying to work out for the past day. 

 

I've set my collection product grid to show 66.111vw and center of page, now I'd like to have my verticle filter to be 16.9vw... so that I keep my product grid centered. BUT, I can not for the world get it to function 😞 

 

Anyone that know how to do this? See code below:

 

Code for collection product grid

.grid-dextop {
display: flex;
gap: 20px;
width: 66.111vw;
margin: 0 auto;
margin-top: 20px;
}

Accepted Solution (1)

EBOOST
Shopify Partner
1288 327 390

This is an accepted solution.

Hi @larsvilhelmsson,


May I suggest to update code these steps:

1. Go to Store Online-> theme -> edit code
2. Assets/base.css

 

@media screen and (min-width: 750px){
    
    body .facets-vertical .facets-wrapper {
        padding-left: 3rem;
        width: 16.9vw;
    }
    body  .facets-vertical .product-grid-container {
        width: 83.9vw;
        padding-left: 16.9vw;
    }
}

EBOOST_0-1713961784755.png

 

 

- Hope can help. If you find my reply helpful, please hit Like and Mark as Solution
- Need a Shopify developer? Contact email: eboost10@gmail.com
- Visit our site: https://www.eboosttech.net to view and download shopify themes and magento2 extensions free
- ❤❤DONATE ❤❤Coffee tips

View solution in original post

Replies 2 (2)

EBOOST
Shopify Partner
1288 327 390

This is an accepted solution.

Hi @larsvilhelmsson,


May I suggest to update code these steps:

1. Go to Store Online-> theme -> edit code
2. Assets/base.css

 

@media screen and (min-width: 750px){
    
    body .facets-vertical .facets-wrapper {
        padding-left: 3rem;
        width: 16.9vw;
    }
    body  .facets-vertical .product-grid-container {
        width: 83.9vw;
        padding-left: 16.9vw;
    }
}

EBOOST_0-1713961784755.png

 

 

- Hope can help. If you find my reply helpful, please hit Like and Mark as Solution
- Need a Shopify developer? Contact email: eboost10@gmail.com
- Visit our site: https://www.eboosttech.net to view and download shopify themes and magento2 extensions free
- ❤❤DONATE ❤❤Coffee tips
larsvilhelmsson
Excursionist
24 0 8

IT WORKED! Cheers, thanks for the help!