Question

我正在尝试将滑块添加到具有左侧和右侧的现有页面。左侧有一个背景图像，一些文本和一个清晰的修复，将图像扩展到右侧的高度。

当我使用Slick Slider并使左侧元素成为幻灯片时，清除修复不再有效，高度由左侧元素的内容决定。

以下是展示问题的2个jsfiddles：没有滑块：http://jsfiddle.net/robmccart/15wrct6g/ 使用滑块：http://jsfiddle.net/robmccart/yj9nerh1/

以下是带滑块的代码：

<div class="parent">
    <section class="right-side"></section>

    <section class="slider left-side">
        <div class="row" style="background-image: url(http://cpaws.org/engaging-networks/images_donation/Donation-pg-Peel-Watershed.jpg);">slide1</div>
        <div class="row" style="background-image: url(http://cpaws.org/engaging-networks/images_donation/Donation-pg-Peel-Watershed.jpg);">slide2</div>
        <div class="row" style="background-image: url(http://cpaws.org/engaging-networks/images_donation/Donation-pg-Peel-Watershed.jpg);">slide3</div>

    </section>
</div>

CSS：

$c1: #3a8999;
$c2: #e84a69;
.parent {
    background: #336633;
}
.right-side {
  float: right;
  height: 700px;
}
.left-side {
    padding-right: 450px;
}

我不确定我是否正确使用了清除修复程序，但看起来Slick Slider注入的代码破坏了某些内容。

由于

光滑滑块幻灯片上的背景图像不会扩展到父元素

0 个答案: