我的div不会居中 [英] My div will not center

问题描述

我试图将所有内容放在我的页面上，除了我创建的div外，所有内容都居中。我不知道为什么。这是我的HTML：

 < section> 
< div id =mydiv3> 
加入联络以下连结！ 
< / div> 
< / section> 
  

以下是css：

 部分{
 font-family：Helvetica，Arial，sans-serif;文本对齐：中心; 
} 
 
＃mydiv3 {
 text-align：center; 
 width：200px; 
 border-style：outset; 
 border-width：8px; 
} 
  

我遇到问题的div叫做mydiv3。

解决方案

元素，这将导致所有内联子元素居中，这就是你想要的。但是，由于＃mydiv3 是一个块元素，所以它不会受到它的 text-align 属性的影响父容器。另一方面，你应用 display：inline-block 来＃mydiv3 ，那么它会与中心对齐。





margin：0 auto 工程因为您也为＃mydiv3 分配了一个特定的宽度。

这两种方法都是有效的。

I am trying to center everything on my page, everything is centered except the div I created. I don't know why. Here is my HTML:

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

and here is the css:

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

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

the div I am having problem with is called mydiv3.

解决方案

If you apply text-align: center to the section element, that will cause all the inline child elements to be centered, which is what you want. However, since #mydiv3 is a block element, it won't be affected by the text-align property of its parent container.

On the other hand, is you applied display: inline-block to #mydiv3, then it would align to the center.

The margin: 0 auto works as demonstrated because you also assigned a specific width to #mydiv3.

Either approach is valid.

这篇关于我的div不会居中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！