我应该如何水平居中一个没有宽度的 div？答案

【问题标题】：How should i center horizontally a div without width?我应该如何水平居中一个没有宽度的 div？
【发布时间】：2015-06-24 08:09:33
【问题描述】：

我对 CSS 还是很陌生，但我在 stackoverflow 上尝试了不同的解决方案，但似乎都没有奏效。

这里是父 div ：（现有应用程序，所以我无法控制内联样式，因此使用 !important）

element.style {
    display: block;
    height: 662px;
    width: 1460px;
}
#ModalScroll{
    position:fixed !important;
    top:0;
    left:0;
    z-index:1001; 
    height:1px;
    width:1px;
    overflow:hidden;
    display:none;
    font-size:100%;
    text-align:center;
}

子 div：

element.style {
    display: block;
    left: 470px;
    margin-top: 150.5px;
    top: 315px;
    width: 500px;
}

.ModalDialog{
    border:1px solid #3C4749;
    background-color:#FFF;
    margin:0 auto 0 auto;
    display:none;
    position:absolute !important;
    font-size: 12px;
    top: 0px !important;
    box-sizing: border-box; 
    text-align: center; 
    vertical-align: middle;

div 可以有不同的宽度，它完全垂直居中，但我不能水平。

【问题讨论】：

你能做一个jsfiddle吗？
我没有得到反对意见，我是 CSS 新手，并试图为您提供尽可能多的信息。我无法制作 jsfiddle，因为它是一个巨大的应用程序，而且我无法重现现有的内容。
那你能画个图什么的吗？很难跟上。
你只能访问css还是可以修改html或添加一些javascript？
您要居中哪个 div，父级还是子级？

标签： html css centering

【解决方案1】：

您可以使用 position:absolute 和翻译技巧来做到这一点：

yourDiv{
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}

【讨论】：

你能发个小提琴吗？
我告诉其他用户，我只能访问 css。

【解决方案2】：

这也可以集中一个元素（具有宽度）

{
    margin-left:auto;
    margin-right:auto;
}

【讨论】：

【解决方案3】：

这是一个相当简单的解决方案，我只需要添加子 div：

{
...
    right: 0px !important;
    left : 0px !important;
}

【讨论】：