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就可以,但這并不是我想要的。
問題解答
回答1:display: table-cell;vertical-align: middle;
回答2:我后來換了另一種水平垂直居中寫法
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
回答3:在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;}
相關文章:
1. javascript - 游戲里物體角色層次渲染邏輯和代碼怎么寫才好?2. javascript - 關于Lazyload遇到的問題3. java - 我在用Struts2上傳文件時,報以下錯誤怎么回事?4. javascript - 如果根據參數給table中的tr綁定不同事件5. 算法 - python 給定一個正整數a和一個包含任意個正整數的 列表 b,求所有<=a 的加法組合6. angular.js - react的redux和vue的vuex,angular呢7. java題目 任意一個字符串 倒置輸出,保持單詞的完整性8. javascript - js一個小的算法問題,找個好一點的答案。9. javascript - js 寫一個正則 提取文本中的數據10. javascript - 新組成的數組打印出來出現問題,里面有對象,但長度為空
