Need help with padding on custom liquid button

My website is tomesclothes.com , this is in reference to the “repair” page

I added a custom liquid button linking to a google form, but I want the button to be centered underneath the photos on this page. The code I used for the button is;

{{ ‘Request Repair Services’ | link_to: ‘https://forms.gle/nnsjqie86ayhwVrA8’, class: ‘button’ }}

Hello @tomesclothes

You can add code by following these steps

  1. Go to Online Store → Theme → Edit code.

  2. Open your theme.liquid file

  3. Paste the below code before on theme.liquid

@media screen and (min-width: 750px) { .section-template--23096824791327__custom_liquid_Bxw6hU-padding { text-align: center !important; } }

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

@tomesclothes
please put this css in code :

.section-template--23096824791327__custom_liquid_Bxw6hU-padding a.button {
    margin: 0 auto !important;
    max-width: 260px;
    display: flex;
}

how would i be able to make it centered on mobile as well?

You can add code by following these steps

  1. Go to Online Store → Theme → Edit code.

  2. Open your theme.liquid file

  3. Paste the below code before on theme.liquid

@media screen and (max-width: 767px){ .section-template--23096824791327__custom_liquid_Bxw6hU-padding{ text-align: center !important; } }

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.