Вопрос простой, но как правильно отцентрировать иконку внутри кнопки. Кнопка-переключатель слайдов у slick-slider
<button class="slider-button slider-button__prev feedback-slider__button">
<i class="fas fa-chevron-left"></i>
</button>
SASS
.slider-button
position: absolute
display: block
margin: 0 auto
padding: 0
width: 63px
height: 63px
top: 50%
transform: translateY(-50%)
font-size: 20px
color: $text-color-dark
border-radius: 100%
border: 1px solid red
box-shadow: -5px 5px 11px rgba(83, 83, 83, 0.16)
background: #ffffff
transition: all 0.5s ease
z-index: 2
cursor: pointer
&:hover
background: $active-color
&__prev
left: -30px
Результат
Все равно как будто не по середине.
Второй вариант flex!important
position: absolute
display: flex!important
align-items: center
justify-content: center
padding: 0
width: 63px
height: 63px
top: 50%
transform: translateY(-50%)
font-size: 20px
color: $text-color-dark
border-radius: 100%
border: 1px solid red
box-shadow: -5px 5px 11px rgba(83, 83, 83, 0.16)
background: #ffffff
transition: all 0.5s ease
z-index: 2
cursor: pointer
Или оба варианта верны, пора отдохнуть?