How can I arrange three buttons inline on my product page?

[vishwa312]

I  have 3 different buttons on my product page I added 3 buttons using block but right now it's vertically I want inline I tried CSS but it's not working. Can anyone tell me how do I create another block for 3 buttons in one group and inline. 

My website:https://storageshedshop.com/products/11-ft-x-7-ft-wood-plastic-composite-heavy-duty-storage-shed-pen...

[PageFly-Oliver · Accepted solution]

Hi @vishwa312 ,

You can try this code by following these steps:

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

Step 2: Search file theme.liquid

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

<style>
@media(min-width:767px){
#main .product-info__quantity-selector {
display: inline;
}
#main .product-info__buy-buttons{
   display: inline-flex;
    width: 66%;
    flex-flow: column;
}
}
</style>

Hope my solution works perfectly for you!

Best regards,

Oliver | PageFly

[vishwa312]

Thank you soo much. But I have 6

button with same class on product page but I want 3 button in one line and another 3 button in second line is it possible? Can you plz help me.

[vishwa312]

Thank you soo much. But I have 6

button on product page but I want 3 button in one line and another 3 button in second line is it possible? Can you plz help me.

Right now when I give same CSS to another 3 button it's goes up with 1 line 3 button.

website link: https://storageshedshop.com/products/11-ft-x-7-ft-wood-plastic-composite-heavy-duty-storage-shed-pen...