Packery水平佈局問題

Question

希望有人在那裏有packery一些經驗，我使用了一個項目，該項目。

我無法獲得水平佈局的工作。在HTML中聲明打包對象似乎有些作用。

<div class="packery js-packery" data-packery-options='{ "isHorizontal": true }'> 
... 
</div> 

儘管看起來寬度和高度並沒有像文檔所建議的那樣通過CSS來改變。但是我還沒有深入挖掘，因爲我需要使用Javascript。和等效似乎並沒有在所有的工作：

$('.packery').packery({ 
    itemSelector: '.item', 
    isHorizontal: true, 
}); 

這將導致<div>元素packery對象被分配到0像素高和寬4PX。 （4px寬度可能來自某些項目的1px邊框。）packery docs表示水平佈局需要設置高度。但到了文檔所提供的CSS似乎什麼都不做，packery是否在HTML或JavaScript初始化：

/* containers need height set when horizontal */ 
.packery.horizontal { 
    height: 200px; 
} 

不過，我沒有插入的項目是可見的，並且packery <div>爲4像素X 0像素。所以，我強迫容器高度在Javascript：

$('.packery').css('height', '400px'); 

這確實增加了元素的高度，但寬度保持在四個。因此，所有的元素基本上都是零寬度和不可見的。所以，我試圖迫使容器的寬度：

$('.packery').css('width', '1000px'); 

但這個寬度似乎被忽略。我可以在Chrome的開發人員模式下使用元素編輯器強制使用<div>的寬度，並且會生成一些可見的（雖然很難看）內容。但是如何在Javascript中設置<div>的寬度？看起來packery覆蓋了我設置的寬度，無論是在packery()的調用之前還是之後執行。

一切都在packery似乎對於垂直佈局工作的偉大。但我真的想使用水平佈局，但我顯然做錯了。誰能幫忙？

Answer 1

我曾與isHorizo​​ntal選項類似的問題。我使用!important標籤在我的css上解決了這個問題，其寬度爲div。