Если бы я хорошо знал CSS я бы не просил помощи на форуме "Новичков".
Я не пыталась вас обидеть.
Просто это достаточно распространенный вопрос, который является основами изучения HTML и СSS.
И поиск смог бы вам
помочь решить ваш вопрос.
Не по теме:
У вас прописаны стили:
Код:
.woocommerce ul.products li.product {
width: 16%;
}
Настоятельно рекомендую убрать их - они ломают всю вёрстку.
На расширении 320 (одно из самых популярных на мобильных устройствах)
Было(когда включен стиль width: 16%):
Стало(когда выключить стиль width: 16%. Удобно для пользователя, который будет просматривать сайт с телефона):
Где править кнопку я прописала в прошлом ответе, а так же, добавила и классы, которые отвечают за вашу кнопку.
А править это всё нужно будет в style.css файле вашей текущей темы.
Классы отвечающие за вашу кнопку ниже
Код:
.woocommerce #review_form #respond .form-submit input, .woocommerce-page #review_form #respond .form-submit input, .woocommerce ul.products li.product a.add_to_cart_button, .woocommerce-page ul.products li.product a.add_to_cart_button {
/**Тут нужно прописать новые стили для кнопки, за размер кнопки отвечает свойство width**/
}
Просто размер вы сами подберите, какой будет отвечать вашим запросам.
Мне понравилось когда я выставила 146px;
и убрала width: 16%;
Смотрите:
И вот, если выставить для кнопки 150px;
и оставить width: 16%;
Но опять же, нужно играться и смотреть как оно будет если, например, зайти с другого браузера.
Обратите внимание на первый вложенный скрин, этот стиль ломает всю вёрстку вашего вывода товаров. Если оставлять width: 16% придётся прописывать медиазапросы для разных разрешений экранов, тестировать, менять, менять, менять и ещё раз менять.
Надеюсь, смогла помочь.
Удачи!
1.png
