Dawn theme mobile view Sticky ATC button customization - urgent

Topic summary

A user is experiencing an issue with a custom sticky Add to Cart (ATC) button on their Shopify Dawn theme mobile view. The button appears shortened instead of full-width on product pages.

Proposed Solution:

  • Add CSS code to base.css file targeting mobile viewports (max-width: 749px)
  • Apply negative margins (margin: 0 -77px !important;) to the .atc-button-container class to extend the button width

Current Status:
The original poster responded with a screenshot after the solution was provided, but did not explicitly confirm whether the fix resolved the issue. The discussion remains open without clear confirmation of resolution.

Summarized with AI on October 28. AI used: claude-sonnet-4-5-20250929.

In my website I’ve added custom liquid code for sticky add to cart in that I want to make the sticky add to cart button in full width, but now it was shorten.

Website: https://the-rugged.com/products/elegant-crew-tee-crimson-peak

password: rugged

Thanks in advance

Hello @Sivadarshan
Go to online store ----> themes ----> actions ----> edit code ----> base.css
add this code at the end of the file and save.

@media (max-width: 749px) {
.atc-button-container {
margin: 0 -77px !important;
}
}

result

If this was helpful, hit the like button and accept the solution.
Thanks

@Rahul_dhiman