css - UC手机浏览器下如何让div水平垂直居中。

问题描述

UC浏览器在宽高固定下，margin:auto，上下左右0；不能水平垂直居中是什么原因？

CSS#globalTip{ position: fixed; left: 0; right: 0; top:0; bottom:0; z-index: 99999; width:75%; height: 50px; line-height: 50px; text-align: center; background-color: #000; color:#fff; font-size: 1.6rem; border-radius: 20px;}

如果position:absolute就可以，但这并不是我想要的。

问题解答

display: table-cell;vertical-align: middle;

我后来换了另一种水平垂直居中写法

css#globalTip{ position: fixed; left:50%; top:50%; z-index: 99999; margin-left: -35%; margin-top:-25px; width:75%; height: 50px; line-height: 50px; text-align: center; background-color: nth($theme-color,1); color:#fff; font-size: 1.6rem; border-radius: 20px;}

但依然想知道UC浏览器用原写法怎么解决bug

在absolute和fixed定位方式下使用

#globalTip{ position: fixed; left:50%; top:50%; -webkit-transform:translate3d(-50%,-50%,0); transform:translate3d(-50%,-50%);}回答4：

我也遇到了相同的问题uc下 水平垂直居中不管事解决方案

.box{ display: flex; justify-content: center; align-items: center;}