Проблема с позиционированием формы поиска на витрине с помощью плагина поиска продуктов WooCommerce. ⇐ CSS

[Anonymous]

В мобильном представлении при нажатии кнопки поиска в нижнем колонтитуле вверху страницы отображается поле ввода поиска, а внизу ничего нет (ссылка на веб-сайт).
Снимок экрана с продуктом WooCommerce Плагин поиска активирован
Это можно немного улучшить с помощью следующего CSS:

Код: Выделить всё

@media only screen and (max-width: 768px) {
.storefront-handheld-footer-bar ul li.search.active .site-search .product-search {
background-color: transparent!important;
}
.product-search-field {
position: relative!important;
top: 140px!important;
font-size:16px!important;
}
}

Снимок экрана с CSS
Однако если удалить этот CSS и деактивировать WooCommerce Product Search, встроенный поиск в Storefront обеспечит гораздо лучшее представление.
Скриншот без CSS и без плагина поиска товаров WooCommerce
Несмотря на то, что вы заплатили за этот плагин, WooCommerce, похоже, не заинтересовался.
Если Я активирую тему Storefront (деактивируя дочернюю тему) и отключаю все дополнительные PHP, ЗА ИСКЛЮЧЕНИЕМ плагина WooCommerce и Product Search, проблема остается.
В магазине нет плагинов, кроме WooCommerce и поиска товаров WooCommerce
Я думаю, это показывает, что плагин WooCommerce Search Product НЕ работает с темой Storefront.
Или я что-то не так?
Любая помощь будет очень признательна, поскольку я много часов искал и экспериментировал.

Подробнее здесь: https://stackoverflow.com/questions/782 ... t-search-p