前端 - Safari:select下拉框的字體不能居中。
問題描述
在chrome上使用text-align沒有用,后來試了下text-align-last:center有作用,但是在Safari上 是無效的;
Google后也沒發(fā)現(xiàn)什么有價值的,有哪位遇到過嗎?
問題解答
回答1:有一個hack的辦法
在select的位置寫一個span,用js去綁定span里的值和select的值,讓span元素居中,隱藏掉select。
大約是這樣的:
js的內(nèi)容就自己寫一下吧
.pesu-select { text-align: center;border:solid 1px #000; } .pesu-select select { position: absolute; left: 0px; top: 0px; width: 100%; height: 42px; opacity: 0; } <p class='pesu-select'> <span>aaa</span> <select> <option value='1'>aaa</option> <option value='2'>bbb</option> <option value='3'>ccc</option> </select> </p> 回答2:
其他途徑解決問題:select外面包一層p,select的寬度不設(shè)置(由內(nèi)容撐開),設(shè)置容器的寬度與text-align:center;
相關(guān)文章:
1. javascript - immutable配合react提升性能?2. javascript - sublime快鍵鍵問題3. javascript - nodejs關(guān)于進(jìn)程間發(fā)送句柄的一點疑問4. javascript - 移動端上不能實現(xiàn)拖拽布局嗎?5. 實現(xiàn)bing搜索工具urlAPI提交6. Apache 已經(jīng)把網(wǎng)站根目錄的改為allow from all了,但是服務(wù)器還是不能訪問?7. css - 寫頁面遇到個布局問題,求大佬們幫解答,在線等,急!~8. phpstudy8.1支持win11系統(tǒng)嗎?9. 配置Apache時,添加對PHP的支持時語法錯誤10. vue.js - Vue 如何像Angular.js watch 一樣監(jiān)聽數(shù)據(jù)變化

網(wǎng)公網(wǎng)安備