I hope you are well today and thank you for your question.
Please use the below custom CSS code to increase its width.
.header-widget-area form.is-search-form {
width: 710px;
max-width: 100%;
}
You can change the styling of the search form by using Search Form Customizer on the below path.
Admin Area -> Ivory Search -> Search Forms -> Edit Search Form -> Design -> Search Form Customizer
Best regards,
Thread Starter
jay126
(@jay126)
HI Sir
I have change accordingly yet the width no effect .
can pls advise?
.header-widget-area form.is-search-form {
width: 1000px;
max-width: 100%;
}
Thread Starter
jay126
(@jay126)
Hi Sir,
it works , thanks. however how to make the search bar responsive in mobile?
-
This reply was modified 5 years, 1 month ago by
jay126.
Thread Starter
jay126
(@jay126)
I tried to customize the code to below and it back to original length .
.site-container > .header-widget-area form.is-search-form {
max-width: 1065px;
margin: 0 auto;
}
Please try using the below CSS code.
.header-widget-area form.is-search-form {
width: 710px;
max-width: 100%;
display: table-cell;
}
Thread Starter
jay126
(@jay126)
hi Vinod ,
additonal question how to adjust border radius? i added “border-radius: 15px” but no effect taken.
.header-widget-area form.is-search-form {
width: 810px;
max-width: 100%;
display: table-cell;
border-radius: 15px;
}
You can adjust border-radius by using the below CSS code.
.is-form-style.is-form-style-3 input.is-search-input {
border-radius: 15px 0 0 15px;
}
.is-form-style button.is-search-submit,
.is-search-icon {
border-radius: 0 15px 15px 0;
}
You are always welcome, I’m glad I was able to help you with this matter. There is no obligation but by your kind words I wonder if I could trouble you to leave a review based on this experience here:
https://wordpress.org/support/plugin/add-search-to-menu/reviews/
I’d really appreciate that. 🙂
And if I can be of any further assistance please don’t hesitate to ask.
