Question

我创建了这个倒计时（code here），由于某种原因，数字似乎在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;
}

跨度浮动在Safari中不起作用？

1 个答案: