Hi there, just wondered if anyone could help me with this. The ‘sort by’ menu, on my products/collection pages, seems to have a thick border around the text when active (the border disappears when I click somewhere else). Is there any way to either get rid of the border or to make it thiner? It looks to me like there are two sets of background on top of each other, (e.g. container background and text background etc). I have tried many codes but to no avail. Can anyone please help?
Hello There,
- In your Shopify Admin go to online store > themes > actions > edit code
- Find Asset → base.css and paste this at the bottom of the file:
.sort-by__btn:focus {
border: none;
outline: none;
}
Sadly, still not working for me. Should I mention that the theme I use is dawn?
Hello There,
Please share your store URL and password.
So that I will check and let you know the exact solution here.
Hello There,
- In your Shopify Admin go to online store > themes > actions > edit code
- Find Asset → theme.css and paste this at the bottom of the file:
.product-filters select:focus {
outline: none;
border: 1px solid #ccc; /* adjust the pixel value to change border thickness */
}
Hi @peaches22 ,
This is Henry at PageFly - Shopify Advanced Page Builder app.
You can try this code by following these steps:
Go to Online store => themes => actions => edit code and add this code on file theme.liquid before tag
Hope this answer helps.
Best regards,
Henry | PageFly
@PageFly-Henry This worked for me. Thanks Henry!
Hi @ZestardTech , I’ve tried your codes but still didn’t get the result I looked for but all good now. Thanks for helping!
It is my pleasure to help you




