Submit Search Button

[Finlando]

Hi there,

Is it possible to place the search submit button on the right side, next to the search field (not inside)?

Thanks!

[ruenel]

Hello @Finlando,

Thanks for writing in!

To resolve your issue, simply edit you header and in the search inline element settings, find the Content option where you can select the position of the input and the submit icon to 1st and 2nd.

You can then style the input, submit and clear element within the settings.

Please let us know how it goes.

[Finlando]

Hello @RueNel,

Thanks a lot for Your reply! With Your solution, the button is on the right side but still inside the search form.

I don’t know if this is best practice but I solved the problem the following way.:

I can achieve this effect with the following code, but then the button is no longer clickable…

.x-search-btn-submit {
   right: -37px !important;
   position: relative !important;
}

Then I put margin-right: 33px; on the container and the button is clickable.

Thanks!

[christian]

Hey @Finlando,

You don’t need CSS to push the button outside. Still following the Content setup posted previously by Ruenel, set the Clear Right Margin to a negative value.

Hope that helps.