add to cart button next to the buy now button

[Dalila2]

I could use your help please. I would like to put the add to cart button next to the dynamic payment button. Like that:

I tried this code in theme.liquid: 

<style>
    .button--full-width {
      width: calc(100% - 150px) !important;
      margin-top: -72px;
      margin-left: 150px;
    }
    </style>

but it gives me that.It also moves the button to choose options for complementary products from the “seach and control” application.  Normally it's like this 

I have a second question. I would like to put the "guide des tailles" pop up next to the quantity selector, what can I do?

https://www.peelou.fr/products/pack-peelou

[PageFly-Henry]

Hi @Dalila2 

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file -> Save

.product-form__buttons {

    display: flex !important;

    align-items: flex-start !important;

    max-width: 50rem !important;

}

.shopify-payment-button {

    width: 50rem !important;

}

Hope that my solution works for you.

Best regards,

Henry | PageFly

[Dalila2]

@PageFly-Henry 

Great they are aligned thank you, on the other hand they are glued

[PageFly-Henry]

You can try again with this code:

.product-form__buttons {
display: flex !important;
align-items: flex-start !important;
max-width: 50rem !important;

}
.shopify-payment-button {
width: 50rem !important;
margin-left: 10px !important
}

[Dalila2]

@PageFly-Henry 

Great thanks a lot.

Do you have a solution to put the “guide des tailles” pop-up next to the quantity selector?

[ThePrimeWeb]

Hey @Dalila2,

Can you try adding this

.shopify-payment-button__more-options {
    position: absolute;
    left: 0;
}

.product-form__buttons {
    display: flex;
    justify-content: space-around;
    gap: 15px;
}

button#ProductSubmitButton-template--20581406081373__main {
    width: auto;
}

[Dalila2]

@ThePrimeWeb 

Thank you very much. This solution could work but the buttons are not the same size

[ThePrimeWeb]

@Dalila2 Try this, maybe because the paypal button loads later the first one might have had some issues

.shopify-payment-button__more-options {
    position: absolute;
    left: 0;
}

.product-form__buttons {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
}

When I do editing after the page has loaded it looks to me like this, 

[Dalila2]

@ThePrimeWeb 

Great thanks a lot.

Do you have a solution to put the “guide des tailles” pop-up next to the quantity selector?