Solved

quantity selector on the same line as the Add to Cart button DAWN theme

jecbon
Explorer
60 0 23

I want the add to cart button next to the quantity selector on the dawn theme? how do i go about doing this ? cheers .

Accepted Solution (1)
Zworthkey
Shopify Partner
5581 642 1565

This is an accepted solution.

@jecbon 
Paste this code on top of the base.css file.

@media only screen and (min-width: 992px) {
.button--full-width {
    display: flex;
    width: 75% !important;
    position: relative !important;
    left: 145px !important;
    top: -70px !important;
}
}



View solution in original post

Replies 17 (17)

Zworthkey
Shopify Partner
5581 642 1565

Hii, @jecbon 
Kindly share your store URL so,
I can solve it perfectly.
Thank You.

jecbon
Explorer
60 0 23

it is just the dawn theme shouldnt the solution be the same for all ? just a change the CSS file 

 

Zworthkey
Shopify Partner
5581 642 1565

@jecbon 
Can you give me a screenshot of what you want so,
I can solve it.
Thank You.

jecbon
Explorer
60 0 23

jecbon_0-1635587983632.png

 

Zworthkey
Shopify Partner
5581 642 1565

This is an accepted solution.

@jecbon 
Paste this code on top of the base.css file.

@media only screen and (min-width: 992px) {
.button--full-width {
    display: flex;
    width: 75% !important;
    position: relative !important;
    left: 145px !important;
    top: -70px !important;
}
}



jecbon
Explorer
60 0 23

thank you sir.

Zworthkey
Shopify Partner
5581 642 1565

@jecbon 
Welcome, Sir.

Bajo
Visitor
2 0 2

Hey there, 

Is it possible to put the quantity selector and variant selector in the same line? 

 

Zworthkey
Shopify Partner
5581 642 1565

Yes, it can be fixed by custom coding. 

Bajo
Visitor
2 0 2

Yes, I did it before in Debut theme using custom code, but that code isn't working in Dawn theme.

 

 

Zworthkey
Shopify Partner
5581 642 1565

@Bajo 
Make Both quantity and add to cart class in a single div.

And add inline both it.

TT-ZT
Tourist
11 0 3

Hi, 

This was very helpful but now there's a pretty big white space under the button and before text content below. Is there a way to reduce it? This isn't an issue in mobile responsive view. 

zanatea_0-1644353718625.png

 

mas88
Visitor
2 0 0

Hi,

How did you get this code to work on mobile?

mas88
Visitor
2 0 0

Update: Because the "@media only screen and (min-width: 992px)" basically talks about this code only working for a screen with a minimum width of 992 (meaning a desktop wide screen) you just need to lower the pixels. Although, I still need to figure out how to format the buy button so it is not hanging off the page.

dmwwebartisan
Shopify Partner
12280 2546 3694

@jecbon 

Please share store URL!

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app

topdogracing
Visitor
3 0 0

Is there a way to move this the same way for the mobile site?

Zworthkey
Shopify Partner
5581 642 1565

@topdogracing 
Yes it is possible.
Kindly share your store URL so,
I can solve it perfectly.
Thank You.