html - 居中动态div

This question already has answers here:

Vertically centering a div inside another div [duplicate]
                                
                                    （24个答案）
                                
                        
                                4年前关闭。
            
                    
我想将exactCenter div居中到页面的确切中心。我正在使用引导程序。我尝试如下，但由于动态宽度（我需要动态宽度），所以我不知道如何将其居中到页面的确切中心？

我创建了一个Fiddle

<div class="wrapper row">
    <div class="col-xs-12 col-sm-6 col-md-4 exactCenter">Test</div>
</div>

CSS：

.wrapper{
    width: 100%;
    height: 100%;
    position: fixed;
}
.exactCenter {
    position: fixed;
    background-color: #00FF00;
    top: 50%;
    left: 50%;
    text-align: center;
    /*margin-top: -15%;
    margin-left: -30%; */
}

编辑：

我想避免使用transform: translate(-50%, -50%);-有时文本模糊。

我用谷歌搜索的所有答案都有固定的宽度和高度（内格）。但是在我的情况下，宽度和高度是动态的。

最佳答案

尝试这个：

.exactCenter {
    position: absolute;
  margin: auto;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 200px;
  height: 100px;
  background-color: #ccc;
  border-radius: 3px;
}

有很多不同的方法可以做到这一点-这只是一个简单的例子

关于html - 居中动态div ，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/33958022/