如何在流沙中插入物品jQuery插件

我的問題是，在某些屏幕分辨率下，列表項不在中心，而<ul>居中。
有誰知道解決方案？
謝謝！如何在流沙中插入物品jQuery插件

HTML：

<ul class="news-grid"> 
    <li></li> 
    <li></li> 
</ul>

腳本：

$(function() { 
    $('#buttons a').click(function(e) { 
     $.get($(this).attr('href'), function(data) { 
      $('.news-grid').quicksand($(data).find('li'), {adjustHeight: 'dynamic'}); 
     }); 
     e.preventDefault(); 
    }); 
});

CSS：

.news-grid { 
    overflow: hidden; 
    margin: 0px; 
    padding-left: 0px; 
    width: 100%; 
    line-height: 1.4em; 
} 

.news-grid:after { 
    content: ""; 
    display: block; 
    height: 0; 
    overflow: hidden; 
    clear: both; 
} 

.news-grid li { 
    display: block; 
    float: left; 
    width: 217px; 
    text-align: left; 
    line-height: 17px; 
    color: #686f74; 
    height: 268px; 
    overflow: hidden; 
    background: url(../images/item_png8.png) no-repeat top left; 
    margin: 0px 0px 20px 30px; 
}

來源

2010-06-04 Nikos

你可以很容易地通過使用這個css（假設你有一個清除ul/li的邊距，填充和列表樣式的重置）來做到這一點。通過將顯示設置爲內聯並且不設置寬度，每個li將以ul text-align: center爲中心，並且由於右邊距應相對均勻地放置。

#news-grid 
{ 
    overflow: hidden; 
    text-align: center; 
    width: 100%; 
    /* whatever other specific styles you want */ 
} 

#news-grid li 
{ 
    display: inline; 
    margin-right: 2%; 
    /* whatever other specific styles you want */ 
}

來源

2010-06-04 17:01:01 ryanulit

我試過你的解決方案，但如果我不設置寬度李元素每個元素需要整個ul的寬度... – Nikos 2010-06-04 23:19:56

最後我重新考慮你的解決方案，我想通過，如果我設置一個固定寬度的李並設置顯示：內聯表我終於得到了我期待的！ – Nikos 2010-06-06 22:26:41

我，當涉及到HTML和CSS的專家，但我想你可以開始檢查以下幾點：

在您的代碼之前是否有任何ResetCss表單被稱爲？
這個顯示器給你什麼瀏覽器？
您是否嘗試過「margin：auto;」在的「李」類定義？

來源

2010-06-04 13:06:16 MaxouMask

這不是一個CSS問題，因爲特定的腳本計算可用寬度並顯示爲項目可以適合的。例如，如果可用寬度爲800px，每個項目爲200px，則腳本每行顯示4個項目，但如果每個項目都是210px，則顯示3個項目，並且170px右側有空白區域。我想要做的是把這3件物品居中放置。 – Nikos 2010-06-04 13:13:26

您可以添加完整的html，以便我們可以更好地展示它的外觀？ – ryanulit 2010-06-04 16:52:48

我上傳了http://sportfeed.nikosk.com/ 謝謝！ – Nikos 2010-06-04 23:09:50

如何在流沙中插入物品jQuery插件

回答

相關問題