Title: Button size Last modified: April 8, 2024 --- # Button size * Resolved [syntve](https://wordpress.org/support/users/syntve/) * (@syntve) * [2 years, 2 months ago](https://wordpress.org/support/topic/button-size-31/) * Hi, * I have an issue where the buy now button on the archive page changes class name when I activate the quantity function on the archive pages. This makes it impossible to change the button with CSS without also changing the button on the product page as the class for those buttons is changed to the same class.  I really want to change the button so that it would align with the quantity box, and not take up so much space. It is also a difference in the size of the button on the variable products and the single products. Is there a way to fix this?  * [https://safety.nortek.st/produktkategori/brannalarm/spesialdeteksjon/linjedetektor/](https://safety.nortek.st/produktkategori/brannalarm/spesialdeteksjon/linjedetektor/) * Best regards * Synnøve * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fbutton-size-31%2F%3Foutput_format%3Dmd&locale=en_US) to see the link]_ Viewing 8 replies - 1 through 8 (of 8 total) * Plugin Contributor [Md. Ibrahim Khalil](https://wordpress.org/support/users/mdibrahimk48/) * (@mdibrahimk48) * [2 years, 2 months ago](https://wordpress.org/support/topic/button-size-31/#post-17677888) * Could you explain it with some screenshots or a screen-recorded demonstration video? So that, we can understand your issue and requirements clearly. Thanks for your cooperation. * Thread Starter [syntve](https://wordpress.org/support/users/syntve/) * (@syntve) * [2 years, 1 month ago](https://wordpress.org/support/topic/button-size-31/#post-17686678) * Hi, When activating the **Archive Quantity Box** in the plugin settings, the class for the button on the archive page changes and becomes the same as the one in the product page. This makes it impossible to edit them with CSS without changing them both. I have added a link so you can see: * [https://www.garasje-loftet.no/wp-content/uploads/2024/04/Button.png](https://www.garasje-loftet.no/wp-content/uploads/2024/04/Button.png) * Plugin Contributor [Md. Ibrahim Khalil](https://wordpress.org/support/users/mdibrahimk48/) * (@mdibrahimk48) * [2 years, 1 month ago](https://wordpress.org/support/topic/button-size-31/#post-17703144) * Hello, Use this CSS code to change the width of the button from the Archive Page: * `.button,.ct-button,.added_to_cart,.ct-button-ghost,[type=submit],.wp-element- button,.wp-block-button__link,button.regform-button,button[class*=ajax],.woocommerce button.button,.woocommerce-message .showlogin,.woocommerce-message .restore-item,. forminator-ui[data-design=none] .forminator-button,.fluentform .ff-el-group button. ff-btn,.ct-button-secondary-text { width: 55px !important;} * Thread Starter [syntve](https://wordpress.org/support/users/syntve/) * (@syntve) * [2 years, 1 month ago](https://wordpress.org/support/topic/button-size-31/#post-17715099) * Thank you for helping me, this solved my problem. * Thread Starter [syntve](https://wordpress.org/support/users/syntve/) * (@syntve) * [2 years, 1 month ago](https://wordpress.org/support/topic/button-size-31/#post-17715344) * Hello again. I see now that the issue was not solved. When adding this CSS. Other buttons on our site also changes. Not only the one on the archive pages. * [https://www.garasje-loftet.no/wp-content/uploads/2024/04/Skjermbilde-2024-04-26-kl.-10.59.17.png](https://www.garasje-loftet.no/wp-content/uploads/2024/04/Skjermbilde-2024-04-26-kl.-10.59.17.png) * Thread Starter [syntve](https://wordpress.org/support/users/syntve/) * (@syntve) * [2 years ago](https://wordpress.org/support/topic/button-size-31/#post-17812138) * Is it possible to fix this? * [Md Abdullah Al Arif](https://wordpress.org/support/users/faithcoder/) * (@faithcoder) * [2 years ago](https://wordpress.org/support/topic/button-size-31/#post-17812358) * Hi [@syntve](https://wordpress.org/support/users/syntve/), * Hope you are well. You know that most of the styles are coming from the Theme you’re using. Please use this code for your Additional CSS: * ```wp-block-code //for archive page.ct-woo-card-actions > form.cart > .ct-cart-actions { align-items: center !important; justify-content: center !important;}.ct-woo-card-actions > form.cart > .ct-cart-actions > button { max-width: 70px; display: inline-block; padding: 0 !important; margin: 0 auto;}//for single product page.ct-product-add-to-cart > form.cart > .ct-cart-actions > button { max-width: 70px !important; padding: 0 !important; display: inline-block;} ``` * This will center-align the quantity field and Buy button [[screenshot](https://prnt.sc/RfuewRAZyIDV)]. I hope this style doesn’t affect other buttons on the site. * Kind Regards * Arif - This reply was modified 2 years ago by [Md Abdullah Al Arif](https://wordpress.org/support/users/faithcoder/). * Thread Starter [syntve](https://wordpress.org/support/users/syntve/) * (@syntve) * [2 years ago](https://wordpress.org/support/topic/button-size-31/#post-17813116) * [Md Abdullah Al Arif](https://wordpress.org/support/users/faithcoder/) Thank you so much! This worked. And it did not affect the other buttons. * Best regards Synnøve Viewing 8 replies - 1 through 8 (of 8 total) The topic ‘Button size’ is closed to new replies. * ![](https://ps.w.org/woo-min-max-quantity-step-control-single/assets/icon-256x256. png?rev=3538540) * [Min Max Control - Min Max Quantity & Step Control for WooCommerce](https://wordpress.org/plugins/woo-min-max-quantity-step-control-single/) * [Frequently Asked Questions](https://wordpress.org/plugins/woo-min-max-quantity-step-control-single/#faq) * [Support Threads](https://wordpress.org/support/plugin/woo-min-max-quantity-step-control-single/) * [Active Topics](https://wordpress.org/support/plugin/woo-min-max-quantity-step-control-single/active/) * [Unresolved Topics](https://wordpress.org/support/plugin/woo-min-max-quantity-step-control-single/unresolved/) * [Reviews](https://wordpress.org/support/plugin/woo-min-max-quantity-step-control-single/reviews/) * 8 replies * 3 participants * Last reply from: [syntve](https://wordpress.org/support/users/syntve/) * Last activity: [2 years ago](https://wordpress.org/support/topic/button-size-31/#post-17813116) * Status: resolved