css - DIV 讓數字水平垂直置中？
問題描述
.unsolve{ position: absolute; right: 10px; top:50%; transform: translate(0,-50%); z-index: 1; font-size: 13px; background-color: red; border-radius: 50%; color:#fff; width: 15px; height: 15px; padding: 5px; text-align: center;}
<p class='unsolve'>12</p>
這樣設定的時候，數字都會中間偏下，沒辦法完全中間。請問該怎麼讓他完全水平垂直置中？
問題解答
回答1：
.unsolve {position: absolute;right: 10px;top:0;bottom: 0;margin:auto;z-index: 1;font-size: 13px;background-color: red;border-radius: 50%;color:#fff;width: 15px;height: 15px;line-height: 15px;padding:5px;text-align: center; }回答2：
不用這么麻煩單行文字 將行高 line-height 和 height 設為相等即可多行文字需要將文字抱在p標簽中 外層p display:table 內層p display:table-cell
回答3：text-align:center; + line-height:容器元素高度
回答4：既然你都設置 height 了，那就直接設置 line-height 吧
回答5：**設置一下行高就好了 transform: translate(0,-50%) 這句 可以 刪除**
回答6：單行的垂直居中 使用line-height 即可。
回答7：p中單行文字垂直居中，設置line-height和height兩個屬性，且兩者值相同即可實現。
相關文章：
1. Python從URL中提取域名2. 實現bing搜索工具urlAPI提交3. python執行cmd命令，怎么讓他執行類似Ctrl+C效果將其結束命令？4. python - scrapy url去重5. MySQL主鍵沖突時的更新操作和替換操作在功能上有什么差別(如圖)6. 關于mysql聯合查詢一對多的顯示結果問題7. node.js - 微信小程序websocket連接問題8. 數據庫 - Mysql的存儲過程真的是個坑！求助下面的存儲過程哪里錯啦，實在是找不到哪里的問題了。9. node.js - windows10下的npm全局路徑的復原或者將npm徹底刪除？10. python - Django有哪些成功項目？
網公網安備