jquery - CarouFREDsel过滤器/CSS问题

我在响应式（html5样板）布局中使用carouFREDsel jQuery轮播插件。因此，可见项的大小确实发生了变化。

我的HTML如下：

 <div class="portfolio-right">
  <div class="portfolio-img-container">
     <div class="portfolio-img"><img  src="img/purple-ink-likes-1.jpg" /></div>
     <div class="portfolio-img"><img src="img/purple-ink-likes-1.jpg" /></div>
     <div class="portfolio-img"><img src="img/purple-ink-likes-1.jpg" /></div>
     <div style="clear:both; visibility: hidden;"></div>
  </div>
</div>

我使用的是样式为“ clear：both”的最后一个DIV，以确保.portfolio-right缩小到其内容（其边框围绕着轮播中的可见项目）。

CSS：

div.portfolio-right
{
  float: right;
  width: 60%;
  border: 8px solid #E6E6E9;
}

我要么需要找到一种使容器缩小到其内容的方法，要么使carouFREDsel中的某些项目起作用（出于某种原因，我无法这样做）。

$(".portfolio-img-container").carouFredSel({
circular : true,
auto : false,
responsive  : true,
scroll      : 1,
items       : {
    filter : ".portfolio-img",
    visible     : 1,
    width       : 200,

},
    pagination: ".portfolio-img-pagination"
});

基本上我的问题是过滤器选项对类或：visible选择器都不起作用。因此，分页中将显示样式为“ clear：both”的最终DIV。

我是否缺少某些东西，也许有解决方法？

最佳答案

如果使用HTML5样板，则有一个方便的内置浮点清除帮助程序类.clearfix。

您只需要将.clearfix应用于具有浮动元素的容器。这是Boilerplate的课程和评论：

    /*
     * Clearfix: contain floats
     *
     * For modern browsers
     * 1. The space content is one way to avoid an Opera bug when the
     *    `contenteditable` attribute is included anywhere else in the document.
     *    Otherwise it causes space to appear at the top and bottom of elements
     *    that receive the `clearfix` class.
     * 2. The use of `table` rather than `block` is only necessary if using
     *    `:before` to contain the top-margins of child elements.
     */

    .clearfix:before,
    .clearfix:after {
        content: " "; /* 1 */
        display: table; /* 2 */
    }

    .clearfix:after {
        clear: both;
    }

关于jquery - CarouFREDsel过滤器/CSS问题，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/14647537/