Css 页边距：自动不居中_Css

Css 页边距：自动不居中

css

Css 页边距：自动不居中,css,Css,以网站上的以下样式： #赞助商{ 保证金：自动；边缘顶部：50px；溢出：隐藏；宽度：自动；显示：内联块； } 分区图像img{ 保证金：3倍；边框：1px实心#ffffff； } 分区图像a：悬停图像{ 边框：1px实心； } 6.470提案国如果从赞助商中删除宽度：自动，则即使使用了边距：自动，赞助商的分区也不会居中对齐同样，如果在上面的正文样式中，将文本对齐：居中替换为边距：自动，则将不会居中对齐，这是荒谬的因为我已经使用了很多次margin:auto，它能够将内容放在

以网站上的以下样式：


#赞助商{
保证金：自动；
边缘顶部：50px；
溢出：隐藏；
宽度：自动；
显示：内联块；
}
分区图像img{
保证金：3倍；
边框：1px实心#ffffff；
}
分区图像a：悬停图像{
边框：1px实心；
}
6.470提案国

如果从

赞助商

中删除

宽度：自动

，则即使使用了

边距：自动

，赞助商的

分区也不会居中对齐
同样，如果在上面的正文样式中，将文本对齐：居中
替换为边距：自动
，则
将不会居中对齐，这是荒谬的
因为我已经使用了很多次margin:auto
，它能够将内容放在中心而没有任何问题。因此，请帮助我，我将非常感激
PS：我使用了firefox，除了使用doctype
标记外，它仍然不能以margin:auto
为中心使用margin:auto
你应该使用位置：relative
，哦，并定义宽度
把你想象成一个浏览器，如果你不知道一个“盒子”（比如div）的宽度，你怎么把它居中
我希望能帮助你
校正：正如Christopher Marshall所说，您不需要位置：相对
，但需要指定宽度。
如果任何div u想要在中间进行边距自动调整，则该div宽度始终是固定的
#sponsors {
width:XXpx;
margin:50px auto 0;
overflow: hidden;
display: inline-block;
 }

对于定心DIV
，您需要为以下内容设置css

示例
#sponsors {
   margin:0px auto;
}

评论
您还需要设置div的宽度
在您的#赞助商
ID上定义宽度
或边距

像这样
#sponsors{
margin:0 auto; // left margin is auto, right margin is auto , top and bottom margin is 0 set
width:1000px; // define your width according to your design 
}

有关
的更多信息，您必须指定div的宽度，并且不能两次提供边距
#sponsors {
    margin:50px auto 0 auto;
    margin-top:50px;
    overflow: hidden;
    width:160px;
    background:aqua
 }

无需使用页边距：0 auto
。请尝试以下代码，它将正常工作：
div#sponsors{
    /* other css properties */ 
    /* remove display:inline-block and margin: auto */       
    width:100%;  /* instead of width: auto */
    text-align: center;

}

div.img{
    /*remove float:left */
    /* other css properties */
    display: inline-block;
}

从body
标记中删除text align:center
，并将其交给h1
标记。
div{
div{
    position: relative;
    border: 1px solid #ddd; 
    width:150px; 
    height:50px;
    margin: auto;
    /*position: absolute; top: 0; left: 0; bottom: 0; right: 0;*/
}
img.displayed {
  margin: auto;
  position: absolute;
  top: 0; left: 0; bottom: 0; right: 0;

}

<html>
<div >
 <a>
 <img class="displayed" src="smiley.gif" >
 </a>
</div>
</html>

位置：相对位置；
边框：1px实心#ddd；
宽度：150px；
高度：50px；
保证金：自动；
/*位置：绝对；顶部：0；左侧：0；底部：0；右侧：0*/
}
显示图像{
保证金：自动；
位置：绝对位置；
顶部：0；左侧：0；底部：0；右侧：0；
}
看一看，也许你有一个float属性。在我的例子中，将float设置为none会有所帮助。现在div已正确对齐。
这对我来说很有效
.classofdiv{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

使用边距居中不需要position:relative。是的，我对position
的看法是错误的，我急忙提了一下，通常我会在css重置时为所有元素定义position:relative
，你用第二次调用覆盖了第一个边距，这是不必要的。id=赞助商的元素居中。这并不重要，因为它有100%的宽度（默认情况下，div
元素有）。你需要具体说明你希望集中在什么地方，以及在什么意义上（它应该是什么样子的）@DanielImms与问题的对比有margin:auto。这和调整这个有什么关系？很好。每个人的答案似乎都是正确的。我选择第一个作为正式答案。为什么CSS宽度可以工作，但是如果你设置了宽度/高度html属性，它就不工作了？
.classofdiv{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}