why is my button top border no showing

[TBS2023]

https://yoga-spirit-mauritius.myshopify.com/

rtewth

[Moeed]

Hey @TBS2023

Follow these Steps:

1. Go to Online Store

2. Edit Code

3. Find theme.liquid file

4. Add the following code in the bottom of the file above tag

RESULT:

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[niraj_patel]

Hello @TBS2023

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

.product-form__buttons button { border-top: 1px solid #fff !important; }

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

[dws_pvt_ltd]

Hello @TBS2023 , Please follow the steps.

1. Go to your Online Store
2. Click on “Themes”
3. Select “Edit code”
4. Open your “base.css” CSS file.
5. Change the following code at the end of the file.

change the css of z-index to 1 → z-index: 1;

.button:before, .shopify-challenge__button:before, .customer button:before, .shopify-payment-button__button--unbranded:before, .shopify-payment-button [role=button]:before, .cart__dynamic-checkout-buttons [role=button]:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1; / change this css of z-index to 1 -> z-index: 1; / 
    border-radius: var(--buttons-radius-outset);
    box-shadow: var(--shadow-horizontal-offset) var(--shadow-vertical-offset) var(--shadow-blur-radius) rgba(var(--color-shadow), var(--shadow-opacity));
}

see the screenshot below.

Feel free to reach out if you have any questions or need assistance.

[oscprofessional]

Hello @TBS2023
Add the code in css file

.product-form__buttons button::before {
z-index: 1;
}

Here is the output

I hope this solution meets our needs.
Thank you!!

[BSSCommerce-HDL]

Hi @TBS2023 ,

Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above tag:

Here is result:

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you

[TBS2023]

This also applies to my contact form on the first block

https://yoga-spirit-mauritius.myshopify.com/pages/contact

[niraj_patel]

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

._formFieldContainer_1ydxd_5 { top: 3px !important; }

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

[dws_pvt_ltd]

Hello @TBS2023

Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code
Step 2: Search file base.css, theme.css, styles.css, custom.css or theme.scss.liquid
Step 3: Insert the below code at the bottom of the file → Save

div#form-container-ref form._formFieldset_1ll8d_67{
    padding: 2px;
}

Best Regards,
DWS

[TBS2023]

none of these solution work!

[TBS2023]

it didn’t work

[niraj_patel]

@TBS2023 Add This

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

._formContainer_stahb_30 { overflow: visible !important; }

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

[TBS2023]

why does it not work for me