5

我在我的页面中使用了一个 jQuery 动画,它添加了一些 CSS 属性,但我不明白为什么margin: auto它不起作用。

HTML 代码(带有由 jQuery 添加的样式属性):

<body style="overflow: hidden;">
    <div id="tuto_wamp" style="width: 7680px; height: 923px; ">
        <!-- Step 1 -->
        <div style="height: 549px; width: 1280px; margin-top: 0px; margin-left: 0px; position: absolute; overflow-y: hidden; overflow-x: hidden; ">
            <div class="content_tuto">
                <img src="images/install1.png" alt="">
            </div>
        </div>
    </div>
</body>

我的 CSS 代码:

#tuto_wamp 
{ 
    background: #3a393c;
    width: 100%;
}

.content_tuto
{
    width: 100%;
    margin: auto;
    display: block;
}

我不知道哪个属性会阻止margin: auto图像居中。

谢谢你。

4

4 回答 4

7

我知道这是一篇旧帖子,但想分享我如何解决同样的问题。

我的图像是float:left从父类继承的。通过设置float:none,我能够margin:0 auto正常工作。希望它可以帮助将来的人。

于 2013-10-09T19:13:09.957 回答
4

添加text-align:center;.content_tuto它会居中

请注意,您有宽度style="width: 7680px; ...style=".. width: 1280px; ...,因此当您居中时,您会以该宽度为中心。

于 2012-05-16T15:30:42.453 回答
1

它不起作用,因为您已将宽度设置.content_tuto100%;

于 2012-05-16T15:20:52.683 回答
0

我创建了一个小提琴并添加了一个边框来可视化和解决

http://jsfiddle.net/meetravi/Y42Pf/

您还可以从这里很好地阅读 css 中的 center a div

http://stever.ca/web-design/centering-a-div-in-ie8-using-marginauto/

希望能帮助到你。

于 2012-05-16T15:41:31.343 回答