2012-02-20 26 views
1

我已經遍佈了stackoverflow尋找一個堅實的解決方案,不過,我來了一個短暫的。我相信我的問題只是在我的語義。如何水平對齊使用jQuery的列表項目

http://jsfiddle.net/hzRAN/10/ 這是一些示例代碼。

爲獲得最佳效果:如果頁面寬度發生變化,我希望將此腳本更改爲重新調整

真正的代碼是從本網站 http://designobvio.us/DoUs/Blog.html 其流體佈局這就是爲什麼我需要的水平列表項本身正確地證明聯。

感謝您的幫助!

回答

2

你可以做到這一點的唯一方法是通過設置各列表項的寬度或通過使用填充:

ul { 
    list-style: none; 
    margin-left: 0; 
    padding-left: 0; /* remove the indention */ 
    overflow: hidden; /* to enclose the float children */ 
    } 

li { 
    width: 20%; /* actually, use some slightly undersized value to supply a bit of slop */ 
    float: left; 
    } 
+0

呃我很笨... ..他工作感謝 – 2012-02-20 01:54:05

2

如果您正在尋找使用jQuery來實現這一點,使用window.resize功能,然後在加載時調用該函數。

$(document).ready(function(){ 

    $(window).resize(function() { 
    // your code here: 


    });  
    $(window).resize(); 
});​ 

我設法得到一個簡單的例子上的jsfiddle運行(我叉你的)http://jsfiddle.net/rSeaE/1/但它有麻煩,由於#daymenu我想的寬度。

+0

嘿男人感謝您的支持!幸運的是我得到這個與CSS工作! – 2012-02-20 03:34:52