Slideshow arrows on mobile view

[tranquilweaves]

Hi I used some code to add these arrows onto my slideshow, the desktop view is how I want. However in mobile view they are showing at the bottom rather than being at each side in the middle. Also the pagination dots is not over the image like in the desktop view. Please can someone help! 

[tranquilweaves]

[BSSCommerce-B2B]

Hi @tranquilweaves 

I have reviewed your requirement , I think you just need add custom font in base.css and the issue will be resolved.  You can follow my instructions! 

Step 1: Go to Admin -> Online store -> Theme > Edit code: 

Step 2: Search base.css and add the script css  in the end of file: 

@media (max-width: 768px) {
    button.slider-button.slider-button--next {
        margin-bottom: 150% !important;
    }
}

Step 3: Save and reload page in storefront. 

And the result, Slideshow arrows on mobile view was set higher.

I hope these instructions will help you. If they are helpful, don't forget to like and mark as the solution.

Have a nice day sir!

[tranquilweaves]

Hi @BSSCommerce-B2B , thanks so much for your response! I really appreciate it. I input the code and it worked for the right arrow however the left arrow is still at the bottom, I have attached a screenshot. Do you know why this would be? Thanks again! 🙂