CSS：Div不会居中，而且很奇怪

Question

我有一个div，我希望将它放在屏幕上，并使用 JQuery ，但它不起作用，因为我将其他divs置于中心位置用同样的方法。

CSS：

#textLinks
{
    text-align:center;
}

JQuery的：

$('#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');代码之后。

DEMO

Answer 2

从jQuery中删除这些行：

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

<强> jsFiddle example

或者如果你想让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 example

Answer 3

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

有：

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