Adjusted page layout to 1400PX, ADD TO CART button cannot adapt to 1400PX

Technical Q&A

Topic summary

A user is experiencing an issue where the ADD TO CART button doesn’t properly adapt after adjusting their page layout to 1400px width.

Solution Provided:

A community member offered a CSS-based fix with step-by-step instructions:

  • Navigate to Shopify Admin → Online Store → Theme → Edit code
  • Locate the section-main-product.css file
  • Find the .product-form__buttons CSS class
  • Modify the max-width property to 44rem (or 100% for full width)

This CSS adjustment should allow the button to properly scale with the 1400px layout. The issue appears unresolved pending the original poster’s confirmation of whether the solution worked.

Summarized with AI on November 7. AI used: claude-sonnet-4-5-20250929.
1

Adjusted page layout to 1400PX, ADD TO CART button cannot adapt to 1400PX，Is there a way to adjust the width of the ADD TO CART button? My website：www.nfcinkcase.com

2

Hi @Nfcinkcase ,

I’m happy to help you with that! You can easily achieve this by modifying a simple CSS code in your theme.

To get started, follow these steps:

  1. Log in to your Shopify Admin panel.
  2. Go to Online Store > Theme > Edit code.
  3. In the code editor, navigate to the section-main-product.css file.
  4. Find the below code in that file and change the max-width property to the size of the button you want. (You can also make it 100%)
.product-form__buttons {
  max-width: 44rem;
}​

Kind Regards,
Roy

1 Like