Bagaimana Saya Membetulkan Jarak Butang Berlebihan dalam Firefox?

Membetulkan Jarak Butang dalam Firefox

Dalam Firefox, butang cenderung mempunyai pelapik dan jarak tambahan berbanding penyemak imbas lain. Ini boleh menjadi halangan kosmetik, terutamanya apabila mengekalkan reka bentuk yang konsisten merentas penyemak imbas yang berbeza.

Untuk menghapuskan jarak ini, tambahkan CSS berikut:

button::-moz-focus-inner {
    padding: 0;
    border: 0
}

Peraturan ini menyasarkan "fokus dalam" pseudo-element, yang khusus untuk Firefox. Dengan menetapkan sifat pelapik dan sempadan kepada sifar, jarak tambahan akan dialih keluar.

Selain itu, dinasihatkan untuk memasukkan sifat sempadan dalam peraturan. Ini kerana menetapkan padding kepada sifar akan mengalih keluar garisan bertitik yang muncul di sekeliling butang apabila ia menerima fokus dalam Firefox. Sesetengah pembangun memilih untuk mengalih keluar garis besar ini sepenuhnya, manakala yang lain menggantikannya dengan elemen visual yang lebih menarik.

Dengan CSS ini disediakan, butang akan mempunyai jarak dan penampilan yang konsisten merentas kedua-dua Firefox dan penyemak imbas lain. Rujuk contoh JSFiddle yang dikemas kini di bawah untuk perbandingan visual:

[JSFiddle yang dikemas kini](http://jsfiddle.net/thirtydot/Z2BMK/1/)

Atas ialah kandungan terperinci Bagaimana Saya Membetulkan Jarak Butang Berlebihan dalam Firefox?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!