Html 如何缩进 DIV？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5335535/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to indent a DIV?
提问by John Smith
I have a divcenter-aligned with its margin sets to 0 auto. Now I want to indent its left margin by 50 pixels from the middle. Whenever I try to do this, though, it aligns the divto the left side of its container and loses the center align. I think it's because it overrides the left field of the margin property. Does anyone know how to accomplish this? For clarification I want to indent it 50 additional pixels from the center of the container.
我有一个div中心对齐的边距设置为0 auto. 现在我想将它的左边距从中间缩进 50 个像素。但是，每当我尝试这样做时，它都会将 对齐div到其容器的左侧并失去中心对齐。我认为这是因为它覆盖了边距属性的左字段。有谁知道如何做到这一点？为了澄清起见，我想将它从容器中心缩进 50 个额外的像素。
回答by mpen
wrap it in another div. make the outer div margin: 0 auto;and the inner div margin-left: 50px
将它包装在另一个 div 中。制作外部 divmargin: 0 auto;和内部 divmargin-left: 50px
.outer {
width: 200px;
margin: 0 auto;
background-color: yellow;
}
.inner {
margin-left: 50px;
background-color: orange;
}<div class="outer">
<div class="inner">
hello world
</div>
</div>回答by Daniel Kutik
<html>
<head>
<title>Test</title>
<style>
#outer {
margin: 0 auto; /*center*/
width:200px;
background-color:red; /*just to display the example*/
}
#inner {
/*move the whole container 50px to the left side*/
margin-left:-50px;
margin-right:50px;
/*or move the whole container 50px to the right side*/
/*
margin-left:50px;
margin-right:-50px;
*/
}
</style>
</head>
<body>
<div id="outer">
<div id="inner">
This is the result!
</div>
</div>
</body>
</html>
回答by Alin Purcaru
try
尝试
padding-left: 50px;
and if that doesn't suffice keep the padding and ad another div inside the bigger one.
如果这还不够，请保留填充并在较大的 div 中添加另一个 div。
回答by Alistair Laing
Wrap another div around your div. Then center align the new div and then margin left or padding left your original div.
在你的 div 周围包裹另一个 div。然后将新的 div 居中对齐，然后将左边距或填充离开原始 div。
