我想在窗口的中心放置一个div（with position:absolute；）元素。但我在这样做时遇到了问题，因为宽度未知。
我尝试了以下CSS代码，但它需要调整，因为宽度是响应的。
.center {
left: 50%;
bottom: 5px;
}
我怎样才能做到这一点？
当前回答
由于我不想更改容器/包装器元素的样式，所以这些解决方案都不适合我。这段代码对我有用：
position: absolute;
left: 50%;
margin-left: -50px;
top: 50%;
margin-top: -50px;
其他回答
我首选的定心方法：
position: absolute;
margin: auto;
width: x%
绝对块元素定位保证金自动左/右、上/下相同
一个JSFiddle在这里。
<body><div style=“position:absolute；left:50%；”><div style=“位置：相对；左：-50%；边框：红色虚线1px；”>我是一些中心收缩以适应内容<br/>翻土；翻土</div></div></body>
如果元素具有宽度和高度，则此解决方案有效
.包装器{宽度：300px；高度：200px；背景色：番茄；位置：相对；}.内容{宽度：100px；高度：100px；背景色：深蓝色；位置：绝对；顶部：0；右：0；底部：0；左：0；边距：自动；}<div class=“wrapper”><div class=“content”></div></div>
#container
{
position: relative;
width: 100%;
float: left
}
#container .item
{
width: 50%;
position: absolute;
margin: auto;
left: 0;
right: 0;
}
这里有一个有用的jQuery插件来实现这一点。我在这里找到的。我不认为纯粹使用CSS是可能的。
/**
* @author: Suissa
* @name: Absolute Center
* @date: 2007-10-09
*/
jQuery.fn.center = function() {
return this.each(function(){
var el = $(this);
var h = el.height();
var w = el.width();
var w_box = $(window).width();
var h_box = $(window).height();
var w_total = (w_box - w)/2; //400
var h_total = (h_box - h)/2;
var css = {"position": 'absolute', "left": w_total + "px", "top":
h_total + "px"};
el.css(css)
});
};
