为什么用户代理样式表会覆盖Safari 7.0.0中的CSS样式表

Question

我们有一个登录页面，除了Safari 7.0.0之外，它在所有浏览器上看起来都很棒，也很好用。我们已经添加了一个带有id=“计数器”的div，它被设置为"display: flex;“，并且该样式可以在除Safari7.0.0(在Mac上)之外的所有浏览器中正确应用。在Safari 7.0.0中，CSS样式被应用"display:block;“"div”的User Agent样式表覆盖。我们已经尝试了我们能想到的所有方法来解决这个问题，比如确保我们使用了正确的doctype，在有问题的CSS样式中添加"!important“，甚至添加内联样式，但都没有用！这个问题只发生在我雇主的电脑上，任何人都可以给我们提供帮助，我们将不胜感激！

#HTML
<div id="counter" class="center-block text-center counter-wrapper">
          <div class="card">
            <div class="time">
              <span id="days"></span>
            </div>
            <p>Days</p>
          </div>
          <div class="card">
            <div class="time">
              <span id="hours"></span>
            </div>
            <p>Hours</p>
          </div>
          <div class="card">
            <div class="time">
              <span id="minutes"></span>
            </div>
            <p>
              <span class="hidden-xxs-down">Minutes</span>
              <span class="hidden-xxs-up">Min</span>
            </p>
          </div>
          <div class="card">
            <div class="time">
              <span id="seconds"></span>
            </div>
            <p>
              <span class="hidden-xxs-down">Seconds</span>
              <span class="hidden-xxs-up">Secs</span>
            </p>
          </div>
          <div class="card">
            <div class="time">
              <span id="milliseconds"></span>
            </div>
            <p>
              <span class="hidden-xxs-down">Millisec</span>
              <span class="hidden-xxs-up">Msec</span>
            </p>
          </div>
        </div> <!-- End Counter -->


#CSS
div#counter .counter-wrapper{
 display: flex !important;
 justify-content: space-between;
 flex-direction: row;
 flex-wrap: wrap;
 width: 85%;
 margin: 0 auto;
 -webkit-display: flex;
 -webkit-flex-direction: row;
}

Answer 1

在旧版本的Safari7.0.0中，任何使用Flex的CSS规则都需要以"-webkit-“开头，请参阅这里的文档：http://www.w3schools.com/css/css3_flexbox.asp。另外，对于使用有问题的计算机的人来说，最好是最终将他们的Safari版本更新到最新版本。Safari 7.0.0是在2013年发布的...！