在屏幕中间居中 Font Awesome

Question

In this jsfiddle 我在左上角有一个旋转的 Font Awesome。如何显示在屏幕中间（垂直和水平）？

HTML

<i class="fa fa-spinner fa-spin"></i>

Answer 1

给它一个 50% 的内边距和 -8 像素的边距（原始大小的 50%）。 body 必须跨越整个 window。为了防止滚动条出现奇怪的行为（由于附加到 .fa-spin 的动画），请在容器上使用这些样式：

<div class="center-all">
  <i class="fa fa-spinner fa-spin"></i>
</div>

css如下：

html, body {
  width: 100%;
  height: 100%;
}

.center-all {
  padding: 50%;
  margin: -8px;
  width: 16px;
  height: 16px;
}

Centering Font Awsome in the middle of the screen