基于屏幕宽度的center a float:left元素?

您希望该DIV相对于浏览器窗口增长,还是使其内容适合浏览器窗口?

如果是前者,你可以只使用一个基于百分比的宽度而不是像素,它应该仍然居中。

如果是后者,不要使用浮点…从设置开始 width:auto; (我认为这应该使它自动扩展以适应内容)。然后您将需要一些JavaScript来测量DIV的宽度,设置 width: CSS属性(以像素为单位),然后测量浏览器窗口,并根据这些测量值将容器居中。

对不起,我错了宽度:auto;。我猜只要浮动它,然后使用上面描述的javascript手动设置右边距和左边距。

对不起,我想了一个更好的解决办法。

#float { 
    float:left;
    margin-left:50%;
    position:relative;
}

然后,使用jquery,

$(document).ready(function() {
    var float_width = $('#float').width();
    var left_spacing = float_width / 2;

    $('#float').css('left', '-' + left_spacing);
});

原谅我,如果我的javascript关闭或不太管用…我没有测试它,我是一个JS noob:)

你可以试着用

.mainWindow {
    margin: 0 auto;
}

然后确保父元素为文本对齐:居中;

我通常使用自动居中的容器DIV,然后将任何其他容器(如浮动的DIV)放入该容器中。你有什么特别的理由不能这样做吗?

示例CSS:

#container {
width: 960px;
margin: 0 auto;
position: relative;
}