Недавно я имел аналогичное требование WooCommerce хотя я хотел сжать вверх/вниз количественные блесны на что-либо, кроме мобильного телефона. Ваш сайт, кажется, вниз, но вот то, что я добавил к своим детям темы style.css, чтобы переопределить значения по умолчанию (ПРИМЕЧАНИЕ: Я использую плагин WooCommerce Composite, который может модифицировали HTML и поэтому требуется CSS селекторы)
@media (min-width: 480px) {
.product-info .product-content #product .add-to-cart .cart .quantity{
width:74px !important;
}
.product-info .product-content #product .add-to-cart .cart .quantity input[type="number"]{
padding:6px !important;
text-align: center !important;
}
.product-info .product-content #product .add-to-cart .cart .quantity input[type="button"]{
line-height:1em !important;
height:15px !important;
}
.product-info .product-content #product .add-to-cart .cart .quantity{
margin-right:10px !important;
}
}
Основные области, представляющие интерес, - уменьшение высоты линии и заполнения. Это позволяло вертикальным центрам вверх/вниз регулировать высоту, сохраняя символы +/- вертикально центрированными. Я завернул свои модификации в медиа-запросе, чтобы я мог настроить таргетинг на большее, чем 480 пикселей.
Я предполагаю, что вы можете сделать что-то подобное, но просто увеличить высоту линии и отступы в соответствии с требованиями.
Эти стрелки называются прядильщиками, и вы можете их стилизовать, см. Этот пример http://jsfiddle.net/BnEmn/1/ – jean
привет спасибо за это, я просто попробовал стилизовать их там, но, похоже, ничего не менял ? – Proximity86
Я внес незначительные изменения, чтобы исправить орфографию и быть последовательным в капитализации. Привлекательный пост быстрее соберет квалифицированный читатель, и, надеюсь, приведет к лучшим ответам. – hardmath