jquery - CSS：Div 不会居中，而且大小很奇怪

Question

我有一个，我想用JQuerydiv在屏幕上居中，但它不起作用，这很奇怪，因为我用相同的方法将其他居中。divs

CSS：

#textLinks
{
    text-align:center;
}

查询：

$('#textLinks').css({
    position: 'absolute',
    left: ($(window).width()/2 - $('#textLinks').outerWidth()/2),
    top: ($(window).height()/2 + $('#ShapesWrapper').outerHeight()/2)
});

JSFiddle链接： http: //jsfiddle.net/j08691/8tvs8/9/
实际网页：http ://sosco.ir/index2.html

Answer 1

您的 div 实际上是正确居中的。它只是margin-left: 87px内联样式。删除它，它会很好地居中。

您可以通过添加来做到这一点

$("#textLinks").css('margin-left','0px');

直接在您的$('[id^=text]').css('margin-left', initX + 'px');代码之后。

演示

Answer 2

从您的 jQuery 中删除这些行：

$('[id^=text]').css('width', x * 2 + 'px');
$('[id^=text]').css('margin-left', initX + 'px');

jsFiddle 示例

或者如果你想保持 div 狭窄，请留在$('[id^=text]').css('width', x * 2 + 'px');

更新：更简单的解决方案似乎是改变这一行：

$('[id^=text]').css('margin-left', initX + 'px');

对此：

$('[id^=text]').not('#textLinks').css('margin-left', initX + 'px');

jsFiddle 示例

Answer 3

尝试替换：

$('[id^=text]').css('margin-left', initX + 'px');

为了：

$('[id^=text]', '#TextWrapper').css('margin-left', initX + 'px');