Cách fix lỗi text bị rớt hàng đơn giản trên Google Chrome

Vài tuần gần đây, khi Google update trình duyệt Chrome lên version mới thì xuất hiện lỗi hiển thị font, text bị rớt hàng… làm team mình bị khách hàng phàn nàn và tìm cách khắc phục vãi cả…ra.

Team mình cũng đã thử cách khắc phục là tìm chỗ nào bị bug rớt hàng thì chèn đoạn property “white-space: nowrap”  vào CSS. Nhưng vẫn không ăn thua, vì không fix hết được các chỗ khác trên site.

Tình cờ và thật bất ngờ, hôm nay mình dòm vào máy tính của bạn report vẫn còn bugs text rớt hàng thì thấy font hiển thị trên site bạn ấy không giống như font của site đang sử dụng thì mới biết rằng Google nó update font style (haizz…)

loi-text-rot-hang-tren-Google-Chrome

Lỗi text bị rớt hàng khi xem site www.vungxaycuocsong.com.vn

Để sửa lỗi này, bạn chỉ cần vào http://www.google.com/fonts update lại style, xong thì copy đoạn link từ Google Font API và thay lại là ổn

Ví dụ, font style của site lúc trước như vầy: http://fonts.googleapis.com/family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&subset=vietnamese <= click vào thì Not found.

Update lại style và thay lại bằng link này thì ổn http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,700,300,600,800,400&subset=latin,vietnamese

Hy vọng sẽ giúp các bạn fix được lỗi này.

Một số cách khác các bạn có thể tham khảo:

http://thuthuat.taimienphi.vn/khac-phuc-loi-hien-thi-sai-font-tieng-viet-tren-chrome-39-2915n.aspx

http://thachpham.com/web-development/sua-loi-lien-ket-bi-xuong-hang-o-google-chrome.html

(Mình không phải dân tech chính hiệu nên chỗ nào viết sai, ace bỏ qua ^_^)

Advertisements