貓頭鷹旋轉木馬切割格

我有一個小問題。我使用OwlCarousel 2，使「證言轉子/滑塊」，但它看起來像這樣：貓頭鷹旋轉木馬切割格

但我需要somethink這樣 - 圖像板缺之上：

我收拾「盒子」在一個更多的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 [上海社會科學院]：

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; 
       } 
      } 
     } 
    }

UPDATE： 這裏是演示：DEMO

來源

2016-04-14 Vertisan

能否請您分享一些的jsfiddle（jsfiddle.net）來重現問題嗎？您提供的代碼與您的問題不完全相同。 –

@VincentG當然，我添加了鏈接 – Vertisan

這是因爲.owl-carousel .owl-stage-outer的overflow: hidden。

我在.owl-item上加了一個margin-top來修復它。

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

Live example

來源

2016-04-14 21:49:15

貓頭鷹旋轉木馬切割格

回答

相關問題