Tengo la interfaz de usuario del elemento donde estoy usando el carrusel. El problema en este momento es que las flechas están entrando o cortando desde los lados.

intenté agregar el div alrededor de los botones como este

 <div class="arrowLeft"><button type="button" class="el-carousel__arrow el-carousel__arrow--left" style=""><i class="el-icon-arrow-left"></i></button></div>

el css de la flecha de arriba es:

 .arrowLeft { z-index: 999; position: fixed;

en firefox, puedo ver la flecha afuera

https://prnt.sc/2uIH99dyTaR1

pero en la parte superior pero en cromo, se muestra así

https://prnt.sc/Q-698jcYqTSe pero no exactamente en el medio

en IE, es así

https://prnt.sc/GJT5pvESW2Wn

No estoy seguro si uso la posición fija o no, pero no estoy 100% seguro de cómo se comportará en los navegadores móviles o ipad.

la posición fija creará problemas.

esta clase el-carousel__arrow el-carousel__arrow--left tiene la posición de absolute :