align =「center」解決方法

我正在使用我沒有爲基於Joomla的網站創建自己的模板。我試圖集中一個jQuery的菜單，並花了幾個小時通過所有的代碼和CSS，似乎無法找到如何做到這一點！所以，我決定創建一個小工作。我做了一個空白PNG圖像，並將其放在菜單的左側，並使其寬度等於我想要的偏移量。這個小黑客的工作正常，但不是所有的屏幕都是相同的大小，所以它實際上並沒有集中在大多數屏幕上。我想知道是否有人知道一個動態的方法來計算中心是什麼，所以我可以動態地改變空白png的寬度，以便在頁面加載時進行。align =「center」解決方法

希望是有道理的任何幫助，將不勝感激

來源

2011-06-17 Andrew

你可以發出html嗎？ – Phil

爲什麼不檢查與螢火蟲或鉻的CSS，然後添加一個CSS記錄，改變你想要的元素？ – Neal

CSS定心的元素：

#elementID { 
    margin: 0 auto; 
}

我的元素需要有CSS width屬性設置爲這地方閱讀生效，但我發現這並非總是如此。

來源

2011-06-17 14:23:00

如何

margin-left: auto; 
    margin-right: auto;

來源

2011-06-17 14:23:16

或者：

margin-left: auto; 
margin-right: auto;

或者

margin: 0 auto;

會工作。 :)

來源

2011-06-17 14:25:57 Magnum26

使用CSS居中元素的典型方法是margin-left:auto; margin-right:auto;。

此外，該元素需要顯示爲一個塊並具有固定的寬度。

所以你的CSS會是這個樣子：

.myelement { 
    margin-left:auto; 
    margin-right:auto; 
    display:block; 
    width:100px; 
}

希望有所幫助。

來源

2011-06-17 14:26:15 Spudley

margin:0 auto

margin:0 auto

與網站的主容器一起使用（這個容器的父容器是主體），當容器內有容器時它會變得有點亂，就像我聽起來你那樣。

嘗試這樣的事情，因爲你知道寬度：

#selector{ 
    width:500px; /* however wide the element is */ 
    position:absolute; 
    top:20px; /* This is whatever you want */ 
    left: 50%; 
    margin-left:-250px; /* this is half of the width */ 
}

來源

2011-06-17 14:29:00 locrizak

嘗試使用Firebug或Chrome檢查CSS，然後添加，改變你想

來源

2011-06-17 14:29:23 Neal

這應該是一個評論而不是答案... – Phil

@菲爾，不，這是一個答案。這可能是問題。 – Neal

地方它在分度，元素的CSS紀錄div封裝即

<div id = "mainWrapper"> 

    <div id = "leftColumn"></div><!-- end leftColumn --> 

    <div id = "centerColumn"> 
    <!-- Put you menu item in here --> 
    </div><!-- end centerColumn --> 

    <div id = "rightColumn"></div><!-- end rightColumn --> 

</div><!-- end main wrapper -->

CSS如下 #mainWrapper { 浮動：左; 寬度：100％; } #leftColumn { float：left; 寬度：25％; } #centerColumn { float：left; 寬度：50％; } #rightColumn { float：left; 寬度：25％; }

來源

2011-06-17 14:48:30 anna

align =「center」解決方法

回答

相關問題