การแก้ปัญหาไม่สามารถกำหนด padding ให้กับ select ในบราวเซอร์บางตั
เราสามารถใช้ text-indent แทนได้ครับ เพื่อทำการเว้นช่องว่างด้านซ้ายของ select
text-indent: 15px;แต่โชคร้ายที่ text-index ของ webkit (เช่น safari, chrome) และ firefox ทำตัวไม่เหมือนกัน ดังนั้น งานนี้เลยต้องมีการ hack นิดหน่อย
@media screen and (-webkit-min-device-pixel-ratio:0) {
/* webkit only */
}สรุปดื้อๆเลยละกันว่า เราจะยังคงใช้ padding กับ firefox ต่อไป และใช้ text-indent กับ webkit แทน
select {
padding-left: 15px;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
/* webkit only */
select {
text-indent: 15px;
padding-left: 0;
}
}