html - スパンフロートがSafariで機能しないままになっていますか？

Question

私はこのカウントダウン（ここにコード）を作成しましたが、何らかの理由で、Safariでは数値が左から右ではなく下に向かっているように見えます。

スパンが広すぎないか、（width: 150px;）なので、なぜこれが起こっているのかわかりません。

誰かがこれを引き起こしているのか、それを修正する方法を知っていますか？

ChromeとFirefoxでテストしましたが、正常に動作しますが、IEについてはわかりません。

Answer 1

display: table;から.nums、およびdisplay: table-cell;から削除するだけです.nums span

デモ

CSS

@font-face {
    font-family: 'Quicksand Book';
    src: url('http://donutdev.com/fonts/Quicksand_Book.otf');
}

#headr {
    font-family: 'Trebuchet MS', sans-serif;
    font-size: 50px;
}

#countdown {
    width: 600px;
    height: 166px;
    background-color: #212121;
    border-radius: 7px;
    display: none;
}

.nums {
    float: left;
    width: 150px;
    padding-top: 20px;
    height: 90px;
    text-align: center;
    font-family: 'Quicksand Book', sans-serif;
    font-size: 50px;
}

.nums span {
    vertical-align: middle;
    color: #dcdcdc;
}

.text {
    float: left;
    width: 150px;
    padding-bottom: 20px;
    text-align: center;
    font-family: 'Verdana', sans-serif;
    font-size: 25px;
    color: #dcdcdc;
}