Center slideshow dots - DEBUT theme

Solved
MiltonM
New Member
8 0 0

Hello, 

I am using the Debut theme.

How do I center the 3 dots at the bottom on MOBILE view and on Desktop view.

My mobile view currently looks like this, The dots are on the side, would like it centered, also on desktop mode it is also a bit on the side. Thanks

 Screen Shot 2021-02-15 at 6.33.34 pm.png

0 Likes
Pallavi
Shopify Expert
691 86 96

Hello There,

Please share your store URL.
So that I will check and let you know the exact solution here.

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
0 Likes
MiltonM
New Member
8 0 0

https://www-lifestylemealprep-com-au.myshopify.com/ 

 

I have emailed you the password

0 Likes
Pallavi
Shopify Expert
691 86 96

This is an accepted solution.

Hello There,

add code assets/theme.scss.liquid bottom of the file

@_media only screen and (max-width:746px) {
ul.slick-dots {
position: absolute!important;
bottom: 20px!important;
display: block!important;
width: 100%!important;
margin: 0!important;
list-style: none!important;
text-align: center!important;
}
}

Thanks!

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
0 Likes
MiltonM
New Member
8 0 0

Hello,

 

Thank you for the code, works perfeclty for mobile however, it is not centre on desktop. Can you give me the code to center the desktop version

0 Likes
Pallavi
Shopify Expert
691 86 96

Hello There,

add code assets/theme.scss.liquid bottom of the file

.slideshow__arrows{
bottom: 20px!important;
width: auto!important;
margin: 0!important;
list-style: none!important;
text-align: center!important;
}

Thanks!

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
0 Likes