固定（底部）位置的中心DIV

无论如何，我似乎无法将#testmenu居中......我尝试了CSS中的几十种组合，但没有运气。请花一分钟时间看看，并保存我的头发不被完全拉出。固定（底部）位置的中心DIV

#abc { 
    position:absolute; 
    bottom: 0; 
    width:100%; 
    left:0; 
    text-align:center; /* IE 5.x centering */ 
} 

#testmenu { 
    line-height:2em; 
    width:960px; 
    color:#FFF; 
    background:#00F; 
    background:#C00; 
    margin:0 auto; 
} 

<div id="abc"> 
    <div id="testmenu"> 
     This should remain 'fixed' bottom center. 
    </div> 
</div>

这里是什么，我以后就是一个简单的jsfiddle：http://jsfiddle.net/mXTmF，也是网页的工作演示：http://ht-webcreations.com/vildiridis/index.php

来源

2013-01-07 bikey77

是奇特，我在看看此刻却发现根本问题是困难的，很奇怪 – Kayo

的问题是，你不能自动适用边际到固定的元素。要允许不同的菜单宽度，我应该这样做：

#abc { 
    bottom: 0; 
    height: 30px; /* forces #testmenu to the bottom */ 
    margin: 0 auto; 
    position: fixed; 
    width: 100%; 
} 
#testmenu { 
    background: none repeat scroll 0 0 #FF0000; 
    bottom: 0; 
    font-size: 10px; 
    height: 30px; 
    overflow: hidden; /* prevents extra space underneath from 33px-high menu items */ 
    margin: 0 auto; 
    max-width: 1000px; 
    width: 960px; 
}

来源

2013-01-07 17:08:02 isherwood

事情很简单，因为你正在使用的菜单固定宽度。添加以下CSS您#testmenu：

position: relative; 
left: 50%; 
margin-left: -480px;

这里你可以看到一个工作演示>http://jsfiddle.net/mXTmF/1/

来源

2013-01-07 16:46:41 BenM

有兴趣了解为什么这一直downvoted ... – BenM

可能是因为它需要明确的保证金值。它不允许改变元素宽度。 – isherwood

@isherwood除了现在差不多2年之久（并且有更好的方法来实现这个目标），你是对的，它不允许改变宽度。然而，最初的问题**明确**处理一个**固定宽度**元素，因为答案很清楚地陈述了...... – BenM

<!DOCTYPE html> 
<html> 
<body> 
<div style='border:1px solid; width:960px; height:200px; position:absolute; left:50%; bottom: 100px; margin-left:-480px;'>hallo</div> 
</body> 
</html>

在CSS中

#testmenu { 
width: 960px; 
position: absolute; 
left: 50%; 
bottom: 100px; 
margin-left:-480px; 
}

来源

2013-01-07 16:47:08 derWilly

尝试提供与问题相关的答案。你的问题有正确的方法，但是OP可能很难说出他如何将它整合到他的具体问题中。 – BenM

@BenM：不能理解你的评论家，这是一个单击复制和粘贴示例。 – derWilly

固定（底部）位置的中心DIV

回答

相关问题