Question

对于所有其他浏览器，我的CSS适用于居中页面中的任何元素，但不适用于safari（在safari 5.1.7 for windows上测试页面），它只是将元素放在左侧，就像没有应用任何样式一样。我的css：

    .centered {
    margin: 0px auto 0px auto;
    display:flex;
    justify-content:center;
    align-items:center;     
    }

在safari上看起来如何：

|stuff                         |  
|text                          |
|more stuff                    |

我尝试过的事情：

http://www.w3schools.com/cssref/css3_pr_align-items.asp

 display:inline-block;

更多代码：

    display: block;
    margin-left: auto;
    margin-right: auto;

Answer 1

首先，Safari 5.1.7已经过时了;你不应该特别针对它。如果人们还在使用它，那就是他们自己的错;浏览器还有很多其他选择！

那就是说，看起来你没有尝试text-align: center，这本来就是解决方案。

.centered {
  text-align: center;
}
.centered > div {
  display: inline-block;
  border:1px dotted green; /* for debugging purposes */
  margin-left: auto;
  margin-right: auto;
  text-align: left;
}

<div class="centered">
  <div>
    stuff<br>
    text<br>
    more stuff
  </div>
</div>

（你没有说出你的HTML是什么样的，但我认为它有点像这样。）

在Safari 5.1.7，IE8，FF3.6和Chromium 20中测试。

Answer 2

为了解决这个问题，我使用了旧的遗留HTML <center>代码。

Safari没有使用css定位元素

2 个答案: