Hi,
The predefined max-width value is 230px. You can’t make the search smaller. Here is a sample CSS code, that helps you adjust search width depends on screen width.
.site-header-section .dgwt-wcas-search-wrapp {
width: 430px;
max-width: 430px;
}
@media (max-width: 1480px) {
.site-header-section .dgwt-wcas-search-wrapp {
width: 310px;
}
}
@media (max-width: 768px) {
.site-header-section .dgwt-wcas-search-wrapp {
width: 350px;
}
}
@media (max-width: 550px) {
.site-header-section .dgwt-wcas-search-wrapp {
width: 230px;
max-width: 230px;
}
}
If you aren’t familiar with custom CSS, take a look at this video.
Hi
Just tried CSS code and still does not work.You can take a look at my site on a mobile and see that search length breaks the site’s width.
Plugin Support
Marta
(@martadella)
Hi dedrami,
Try this piece of code:
@media (max-width: 576px) {
.site-header-section .dgwt-wcas-search-wrapp {
min-width: 190px;
}
}
Regards,
Marta
-
This reply was modified 5 years, 1 month ago by
Marta.
Hi Marta
Guess what….
It works like a charm !!!!!!!!!!
Thanks for your precious time.