如何垂直对齐和自定义滑块箭头

时间:2017-02-09 19:34:04

标签: jquery html css

我添加了css来为.customer-logos的上一个和下一个箭头设置样式,但是标准按钮样式仍显示在添加的css下?如何解决此问题并将按钮对齐滑块的两侧而不是上方和下方?

https://jsfiddle.net/huten0wq/46/

.slick-prev:before, .slick-next:before { font-family: FontAwesome; font-size: 40px; line-height: 1; color: gray; opacity: 0.75; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }   

.slick-prev:before { content: "\f053"; }
[dir="rtl"] .slick-prev:before { content: "\f054"; }

[dir="rtl"] .slick-next { left: -10px; top: 70px; right: auto; }
.slick-next:before { content: "\f054"; }
[dir="rtl"] .slick-next:before { content: "\f053"; }

1 个答案:

答案 0 :(得分:2)

这可能是你想要的

.customer-logos button {
  position: absolute;
  top: 50%;
  z-index: 1;
}
.customer-logos button:nth-child(1) {
  left: 0;
}
.customer-logos button:nth-child(3) {
  right: 0;
}