我的div不会居中

我想把所有东西放在我的页面上，除了我创建的div外，一切都居中。我不知道为什么。这是我的HTML：我的div不会居中

<section> 
    <div id="mydiv3"> 
     Get in Contact with the links below! 
    </div> 
</section>

这里是CSS：

section{ 
    font-family: Helvetica, Arial, sans-serif; text-align:center; 
} 

#mydiv3{ 
    text-align:center; 
    width: 200px; 
    border-style:outset; 
    border-width: 8px; 
}

我有被称为为mydiv3问题股利。

来源

2014-04-01 user3444694

如果您将text-align: center应用于section元素，那将导致所有内联子元素居中，这正是您想要的。但是，由于#mydiv3是块元素，因此它不受其父容器的text-align属性的影响。

另一方面，你应用display: inline-block到#mydiv3，那么它会对齐到中心。

margin: 0 auto的工作原理与此相同，因为您还为#mydiv3指定了一个特定的宽度。

两种方法都是有效的。

来源

2014-04-01 03:19:09

将margin: 0 auto;添加到您的＃mydiv3规则中。看到这个JSFiddle

来源

2014-04-01 03:08:21

试试这个#mydiv3内：

margin:auto;

看到这个fiddle。

来源

2014-04-01 03:08:55 Gab

要回答为什么：
text-align将调整文本的中心，但div没有在其父母的心。因此，您需要设置其他人建议的边距。
当然，一种替代方法是强制您的div与您的父母具有相同的宽度，并使用text-align，它会起作用。虽然这有它自己的麻烦; width: 100%不能直接工作。

来源

2014-04-01 03:20:42 Hans

这里是一个链接，您可以使用帮助。 http://designshack.net/articles/css/how-to-center-anything-with-css/
个人而言，我已经使用

margin-right:auto; 
margin-left:auto;

居中一个div。将其应用于＃mydiv3。希望这可以帮助

来源

2014-04-01 03:26:06 Sai

我的div不会居中

回答

相关问题