Searchbar-Button at wrong place

Hello Support Team,

I found a little problem with my Searchbar Widget on my Website. The Button is placed above the magnifying glass icon

You can see it for example at this site: https://tokuri-sake.de/produkt-kategorie/sake/ in the sidebar (right on top)

How can I fix this?

Thank you for your help

Hi There,

Thanks for writing in! Could you please try adding the following CSS rule into your Theme Options > Global CSS area.

.woocommerce-product-search button {
    margin-top: 40px;
}

Hope that helps.

Hello There,

thank you for the answer. It worked out so far but the magnifing glass icon is still placed wrong.
In my opinion it should be inside the serach bar right?

Why it is apart from it…neither it is a link or something.

Thank you for your time!

Hi There,

Please delete the previous CSS and add this custom CSS instead:

.woocommerce-product-search {
    display: flex;
}

.woocommerce-product-search button {
    height: 38px;
}

Let us know how it goes!

1 Like

Hello @thai,

thank you for your help! With this code the problem is fixed ;)!

Have a nice day!

1 Like