光滑的旋转木马：光滑的旋转木马内的按钮可以覆盖旋转木马？

Question

所以基本上我想用Slick做这样的事情...我想要有正常的幻灯片，但问题是，我想要在其中调用动作（按钮）。通常很容易将按钮放在幻灯片中，但是在旋转木马上有一个溢出：隐藏的样式，除了其他幻灯片显示之外无法取下。我想知道如何实现这一点（按钮稍微向外移动而不会被切断）。

编辑：为旋转木马添加了边框，这是我遇到的真正问题...保持边框并使底部与边框重叠

Answer 1

  

HTML                           

    <div class="slick__slide-cta">
      <button>example</button>
    </div>
  </div>
</div>

  

CSS

.slick__slide-cta {
  height: 40px;
  margin-top: -20px;
}

不完全是这样，但想法是让CTA区域与图像重叠或者其他什么，同时仍然有助于幻灯片的整体高度。有点难以解释，在小提琴中表现会更容易。

Answer 2

这可以通过在.slick-list类中添加填充底部来实现，如下所示：

.myslider .slick-list {
  padding-bottom: 15px;
}

填充底部将是按钮的一半的px值，正在重叠。这是有效的，因为它增加了.slick-list容器的高度，该容器上有overlay:hidden属性。