猫头鹰旋转木马切割 div答案

【问题标题】：Owl Carousel cutting div猫头鹰旋转木马切割 div
【发布时间】：2016-04-15 05:49:15
【问题描述】：

我有一个小问题。我使用 OwlCarousel 2 制作“推荐旋转器/滑块”，但它看起来像这样：

但我需要这样的想法 - 图像在顶部被剪切：

我在另一个 div 中打包了“盒子”，但它没有修复它。
这是我的 HTML：

<div>
    <div class="testimonial-box">
        <div class="testimonial-content">
            <div class="testimonial-logo">
                <img src="http://placehold.it/100x100" alt="" class="img-responsive img-thumbnail pull-left" />
            </div>
            <p>
                <!-- CONTENT -->
            </p>
            <div class="testimonial-meta">
                <p>
                    <h5>Lorem Ipsum</h5>
                    <span>, <i>Web Developer</i></span>
                </p>
                <p class="website">
                    <a href="http://vrs-factory.pl">VRS-Factory</a>
                </p>
            </div>
        </div>
    </div>
</div>

还有 CSS [SASS]：

section.testimonials {
        padding: 30px 0;

        .testimonial-logo {
            img {
                margin-top: -88px;
            }
        }

        .testimonial-content {
            border: 1px solid rgba( $SecondColor, .2 );
            border-radius: 3px;
            padding: 20px;
        }

        .testimonial-meta {
            h5 {
                display: inline-block;
                margin-bottom: 0;
            }
        }

        .owl-carousel {
            .owl-item {
                img {
                    width: auto;
                }
            }
        }
    }

更新： 这是演示：DEMO

【问题讨论】：

你能分享一些 JSFiddle (jsfiddle.net) 来重现这个问题吗？您提供的代码与您的问题不完全相同。
@VincentG 当然，我添加了链接

标签： jquery css owl-carousel

【解决方案1】：

这是因为.owl-carousel .owl-stage-outer 的overflow: hidden。

我在.owl-item 上添加margin-top 来修复它。

.owl-item { margin-top: 70px; }

Live example

【讨论】：