javascript - JQuery Columnizer连续几个Columnizer对象。横向扩展…如何？

我一直在使用JQuery Collumnizer插件。我试着用它来处理几个对象，并将所有对象排成一行，扩展到右边。所以我在底部有一个滚动条。我认为这更多的是一个CSS问题。我尝试了几种包装方法，测试了不同的溢出类型，但最终没有成功。这是我的基本小提琴：Fiddle
我的CSS看起来是这样的：

.column p, .column h1{ padding: 5px; }
body { font-size: 9pt; }
#wrapper {  }
.wide, .thin { clear:both;
}
.wide{
    background:blue;
}
.thin{
    background:yellow;
}

js只启动了columnizer：

$(function(){
    $('.wide').columnize({width:400,height : 400});
    $('.thin').columnize({width:400,height : 400});
});

我喜欢黄色的柱子漂浮在蓝色的右边。有什么办法解决这个问题吗？

最佳答案

在我看来，columnizer静态地改变.wide和.thin div的宽度。除了改变容器的宽度外，没有办法将它们并排放置。所以CSS不会剪切它，您要么使用Javascript，要么使用表（抖动）。所以像这样：

  var tw=$('.thin').width();
  var ww=$('.wide').width();
  $('<div></div>').insertBefore('.wide').append($('.wide,.thin')).width(tw+ww).css('overflow-x','auto');
  $('.wide,.thin').css({display:'inline-block'})

在专栏作家打电话之后。

关于javascript - JQuery Columnizer连续几个Columnizer对象。横向扩展…如何？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/36129814/