css - 从中心偏移 div

Question

我正在尝试将 div x 像素数量定位到页面中心的右侧。因此，div 将相对于中心。

到目前为止，我已经尝试过一些愚蠢的事情

margin:0 auto;
margin-left:20px;

但是您不需要在浏览器中测试它就知道它行不通。

在此先感谢您的帮助。

Answer 1

我会尝试使用两个 DIV，一个在另一个里面。像这样:

<div class="outer">
    <div class="inner">Hello, world!</div>
</div>

.outer {
    width: 1px; /* Or zero, or something very small */
    margin: auto;
    overflow: visible;
    background: red; /* A color just for debug */
}
.inner {
    margin-left: 20px;
    background: yellow; /* A color just for debug */
    width: 100px; /* Depending on the desired effect, width might be needed */
}

参见 this example live at jsfiddle .

根据这个问题/答案，外部 div 将水平居中:How to horizontally center a <div> in another <div>?

然后，内部差异仅向右移动 20 像素，使用边距。

请注意，如果您将 width 保留为 auto，宽度将为零，这可能不是您想要的。