ล่าสุดเจอปัญหาแปลก ๆ ที่ไม่คิดว่าจะเจอ คือใช้ฟ้อนต์จาก f0nt.com มาทำ CSS3 @font-face แล้วฟ้อนต์แสดงผลใน Windows กับ Mac OS ความสูงไม่เท่ากัน ทั้งที่อยู่ใน Browser เดียวกัน (Firefox)
วิธีแก้ คือ เวลาที่เราแปลงฟ้อนต์เป็น CSS3 @font-face ผ่าน FontSquirrel Web Font Generator
ให้เลือก Expert แล้ว ต้องติ๊กถูกตรง Fix Vertical Metrics เสมอ (มันจะติ๊กให้อยู่แล้วถ้าเลือก Expert) ตั้งค่าตามนี้เลย
เพียงเท่านี้ฟ้อนต์ก็จะสูงเท่ากันสวยงามทั้ง Windows / Mac
Leave a Reply