小编lam*_*ore的帖子

Safari中的垂直居中

我在Safari中有垂直居中问题,使用margin:auto 0; 在div上嵌入div的div:inline-flex;

它在Firefox,Chrome,Opera中工作得很好......但是在Safari中失败了(在默认的Android浏览器上,但我正在考虑使用单独的CSS以及iPad使用的任何内容)

这是代码(我正在使用Bootstrap,顺便说一句):http: //jsfiddle.net/n2V5q/1/

<div class="container-fluid head" id="slide1">
    <div class="col-md-6 logo">
        <img src="img/logo.png" alt="THE LOGO" />
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

 .container-fluid {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}

.head {
    color: #fff;
    width: 100%;
    min-height: 100rem; /* for Opera */
    min-height: 100vh;
    padding: 15px;
    background-color: rgba(85,61,148,.9);
    box-shadow: 0px 0px 6px #000000;
    z-index: 90;
    position: relative;
    background-image: url('../img/dither2.png');
    background-position: center bottom;
    background-repeat: repeat-x;
    display: -o-flex;
    display: -ms-flex;
    display: -moz-flex;
    display: -webkit-flex;
    display: inline-flex;
}

.col-md-6 …
Run Code Online (Sandbox Code Playgroud)

html css safari center margin

8
推荐指数
1
解决办法
7174
查看次数

标签 统计

center ×1

css ×1

html ×1

margin ×1

safari ×1