将 div 居中对齐到屏幕在某些浏览器中有效，而在某些浏览器中无效

Question

.txt-loading {
  width: 250px; 
  height: 75px;
  text-align : center;
  position :  fixed;
  top : 0;
  left : 0;
  right : 0;
  bottom: 0;
  margin : auto;
  font-size : 16px;
  z-index : 10;
}

<div class="txt-loading">Loading...</div>

我在互联网上的某处看到此代码将 div 居中对齐到屏幕，它开始在 chrome 上工作，但在 IE 中不工作。我非常确定将 div 置于屏幕中心的 css 样式是错误的，但为什么它在 chrome 中工作，有时也适用于 IE。可能是由于浏览器的 quirks 模式，它可能可以工作，但谁能告诉我为什么它在 chrome 中工作以及为什么它在 IE 11 中不工作。非常感谢任何帮助。

Answer 1

以您的方式将 div 拉伸到整个窗口。使用此代码进行中心定位：

.txt-loading {
  text-align : center;
  position :  fixed;
  top : 50%;
  left : 50%;
  transform: translate(-50%,-50%);
  font-size : 16px;
  z-index : 10;
}

<div class="txt-loading">Loading...</div>