Home › Forums › Basel support forum › Quantity input suffix › Reply To: Quantity input suffix
August 2, 2018 at 10:18 am
#70633
Bogdan Donovan
Keymaster
Hi,
Your plugin changed the structure of quantity buttons so now they look different in the HTML markup (https://prnt.sc/kdqsw4). You need contact the plugin support to know what exactly option of the plugin makes products look different.
Try to replace the previous code with the following CSS code snippet to change the quantity form width:
.quantity .woo-advanced-minus,
.quantity .woo-advanced-plus {
background-color: transparent;
border: 1px solid #E0E0E0;
background-color: transparent;
color: #848484;
min-width: 20px;
background-color: #f9f9f9;
transition: all .2s ease;
-webkit-transition: all .2s ease;
border-radius: 0;
}
.quantity .woo-advanced-minus {
border-right: none !important;
}
.quantity .woo-advanced-plus {
border-left: none !important;
}
.quantity .woo-advanced-minus:hover,
.quantity .woo-advanced-minus:focus,
.quantity .woo-advanced-plus:hover,
.quantity .woo-advanced-plus:focus {
box-shadow: none !important;
outline: none !important;
background-color: #ECECEC !important;
border-color: #E0E0E0 !important;
color: black !important;
}
body .on-cart-plus-minus-button input[type="text"] {
width: 40px !important;
}
body .plus-minus-button {
float: none;
display: inline-flex;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
flex-direction: row;
-webkit-flex-direction: row;
-ms-flex-direction: row;
-webkit-align-items: stratch;
-ms-flex-align: stratcht;
align-items: stratch;
-webkit-justify-content: center;
-ms-justify-content: center;
justify-content: center;
white-space: nowrap;
}
Regards