How to allign Add To Cart Button On Collection Page for mobile view in Dawn Theme

Store Design
1

I have added Add to cart button below products on collection page and main home page. Desktop view is perfect but in mobile view it didn’t allign in a line. Please help me

2

Hi @AyushiVerma

Can you please share your store URL?

3

https://www.lumimour.com/

4

Hi @AyushiVerma
I am unable to see add to cart button on collection page.
Are you working on duplicate theme?

5

I’m playing around with the system, and one thing I’ve come across is that I’m likely to want to rearrange Collection Page to fit my preferred order. Unless I’m just not seeing it, this doesn’t seem to currently be possible without deleting variations and adding them all back in the order I’d like them to appear in.

6

Yes. I am working of copy of my theme

7

Hi @AyushiVerma
Then please share your duplicate theme preview link.

8

https://www.lumimour.com/?_ab=0&_fd=0&_sc=1.

This is url for copy theme

9

@AyushiVerma Please send me the copy theme URL. You provided but it is goes to the main site.

10

It is copy theme preview url

11

@AyushiVerma
Given url is redirecting to the live website.
Please provide copy theme url will get from here

Dbuglabpvtltd_0-1643905883218.png
Dbuglabpvtltd_0-1643905883218.png1365×145 41.3 KB

Dbuglabpvtltd_1-1643905907005.png
Dbuglabpvtltd_1-1643905907005.png605×231 4.38 KB

12

https://q5pxkymzh6c3lgio-57568395417.shopifypreview.com

This is the url of copy website.

13

Hi @AyushiVerma

Add this css in main css file

@media screen and (max-width:480px){
.full-unstyled-link {
  font-size: 13px;
}
.price-item.price-item--sale.price-item--last {
  font-size: 12px;
}
.price--on-sale .price__sale {
  align-items: center;
}
form .button {
  padding: 0px 0px;
}
}

will look like this

Dbuglabpvtltd_0-1643906768826.png
Dbuglabpvtltd_0-1643906768826.png390×576 53.4 KB

14

Which main css file please tell me?

15

theme.css @AyushiVerma

16

Sorry! but i don’t found any theme.css

17

add this any css file
at the end

18

I have added this code to base.css, main-product.css and also try with other css file. But not working

Screenshot (52).png
Screenshot (52).png1920×1080 257 KB

19

@AyushiVerma use important in css

@media screen and (max-width:480px){
.full-unstyled-link {
  font-size: 13px !important;
}
.price-item.price-item--sale.price-item--last {
  font-size: 12px !important;
}
.price--on-sale .price__sale {
  align-items: center !important;
}
form .button {
  padding: 0px 0px !important;
}
}
20

If still not working then can you please provide me admin access of your store.