Firefox下input button內(nèi)文字不能垂直居中的解決方法
發(fā)布時(shí)間:2013-08-01 12:04:32 作者:佚名
我要評(píng)論

在Firefox下input type=”button”的文字是不好居中的,原因在于Firefox自己弄了個(gè)私有屬性,解決方法很簡單,遇到類似問題的朋友可以學(xué)習(xí)下,希望可以幫助到大家
很老的問題了,如今再次碰到,記錄下來,給后來者方便!
眾所周知,在Firefox下input type=”button”的文字是不好居中的,原因在于Firefox自己比較二,弄了個(gè)私有屬性,導(dǎo)致以下問題的出現(xiàn):
1.按鈕左右本身有2px的間距(FF私有屬性寫了padding:0 2px所致);
2.按鈕文字居中是不行的(此時(shí)設(shè)置padding-bottom是沒用的) ;
3.等等…
解決辦法:
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner{
border:none;padding:0;
}
眾所周知,在Firefox下input type=”button”的文字是不好居中的,原因在于Firefox自己比較二,弄了個(gè)私有屬性,導(dǎo)致以下問題的出現(xiàn):
1.按鈕左右本身有2px的間距(FF私有屬性寫了padding:0 2px所致);
2.按鈕文字居中是不行的(此時(shí)設(shè)置padding-bottom是沒用的) ;
3.等等…
解決辦法:
復(fù)制代碼
代碼如下:input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner{
border:none;padding:0;
}
相關(guān)文章
淺談瀏覽器的兼容模式下的button中文字垂直方向不居中顯示
下面小編就為大家?guī)硪黄獪\談瀏覽器的兼容模式下的button中文字垂直方向不居中顯示。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-08-20用CSS讓img input select button 圖片,文本框,下拉菜單,按扭垂直居中的
一直以來,在HTML中,img input select button 這里元素,垂直對齊,比較難。結(jié)果我長大了。我發(fā)現(xiàn)了一個(gè)現(xiàn)像,其實(shí)解決這些問題只是一句話的事。2011-03-08如何讓你的html button本身居中的實(shí)現(xiàn)
這篇文章主要介紹了如何讓你的html button本身居中的實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一2020-06-19