Slider Buttons - Need Aligned Properly!

Hello @ManKaveStore

To center the slider arrows on both side of the screen, i’ve found the solution for it.

You just need to follow below steps:

  1. Go to admin > Online store > edit code.

  2. In code directory, open the file where the CSS for slider is situated which you were mentioned above.

  3. Copy below CSS rules and paste it at the end where above CSS ends.

slider-component {
 position: relative;
}
slider-component .slider-buttons {
  position: absolute;
  top: 41%;
  transform: translateY(-50%);
  width: 100%;
  background: transparent;
}
slider-component .slider-buttons .slider-counter {
 display: none;
}
slider-component .slider-buttons .slider-button {
 position: absolute;
 margin: 0;
}
slider-component .slider-buttons .slider-button.slider-button--prev {
 left: 25px;
}
slider-component .slider-buttons .slider-button.slider-button--next {
 right: 25px;
}
  1. Make sure that you added this CSS rules at right place and save the file.

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.