customise simple list carousel on mobile - move arrows below carousel on mobile instead of at the sides

heyy, 

i need to adjust this carousel on mobile to move the arrows below the text/slides !

thank you! 

www.annajonesbridal.com/gallery

Can you check site url again?

13 hours ago, tuanphan said:

Can you check site url again?

11 hours ago, tuanphan said:

You can add this code to Website Tools > Custom CSS

@media screen and (max-width:767px) {
[data-section-id="6570a29fcd64646c7e2a286a"] {
.user-items-list-carousel .mobile-arrows {
    display: flex !important;
}
.desktop-arrows.user-items-list-carousel__arrow-wrapper {
    display: none !important;
}
}}

 

Thank you so much that worked great!

How do I style them to look like my other website arrows? like arrows attached: 

On 12/11/2023 at 7:18 PM, daniellenoakes said:

Thank you so much that worked great!

How do I style them to look like my other website arrows? like arrows attached: 

Can you share link to page where you use these arrows? I can copy its style easier

13 hours ago, tuanphan said:

Can you share link to page where you use these arrows? I can copy its style easier

so it was:

www.annajonesbridal.co.uk/gallery

- blue carousel (second one on page near the bottom)

HOWEVER you probably cant see the problem any more as I have cheated and adjusted the mobile arrow styling on the squarespace colour styling tab already! i made the background of the arrows blue then lowered the opacity on the colour tab, and then made the arrows white. 

They are smaller than the rest of the arrows on the site and a little bit thicker but im okay with it tbh at this point! 

the code would still be useful though if possible ❤️