How do I remove white border on dropdown menu from Search Bar?

Hi,

It looks like in my theme all borders of dropdown menus, pop up carts etc were with a thick white border. I removed most them by editing the code but now I can’t find help with this one.

How to remove the border on the dropdown menu that appears after you type something in the search bar??

See screenshot below:

1 Like

Hey @Deis ,

Can you share the link to your store please? Thanks

1 Like

Hi,

https://holideisapparel.com/

Hey @Deis ,

Go to your theme’s “Edit Code” Option, then in the search bar type “theme.liquid”
Below the tag “” tag paste the following. Screenshot attached for reference.


Screenshot is for reference only, the correct code to paste is the one shown above.

1 Like

Hi @Deis

If you like to remove the border it would be look like this.

This is the code I use.

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:

.predictive-search {
    border: none !important;
}

And Save.

If you like just to decrease is.

.predictive-search {
    border-width: 1px !important;
}

And Save.

Result:

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

1 Like

Hello,

this didnt work unfortunately.

Hello,

Thank you! It worked, but now I’m thinking about decreasing the size of the border and making ti really slim… how can I do that?

Now the problem is solved in the meain search bar, but not in the search bar that appears after you search something in the search bar… i know it sounds confusing but… see screesnhots below

Just change the code to this, same instructions.

If you want the border back, just replace ‘none’ with ‘1px’ or any pixel size you want.


1 Like

Thank you! It worked, but still can’t adjust the border size even by changing “none” to "1px or any px number…

Sorry I forgot, you need to write the border size, type , and colour.

so type ‘1px solid #fff’.

Leave solid as it is. you can change colour from $fff to anything you want, and the size from 1px to whatever you need.

1 Like

Thank you!!!

thanks

What is this first one you added by yourself? It’s the one causing those issues. Remove that please.

ThePrimeWeb_0-1714760171634.png

1 Like