Css trên chrome bị lỗi và cách khắc phục

Mình biết lỗi này chẳng liên quan gì đến SEO nhưng hiện tại số người dùng Chrome và Cốc cốc ngày càng tăng, mà 2 trình duyệt này đang bị dính lỗi này nên để cho 1 website trông đẹp mắt hơn thì anh em SEO cũng nên chú ý một chút về giao diện để người dùng ở lại web lâu hơn. Hi vọng là có ích cho anh em.

Vừa qua trình duyệt nổi tiếng Chrome của Google được cho là dính phải một số lỗi hiển thị css.
Sau khi tìm hiểu, thì lỗi này chỉ xuất hiện trên bản cập nhật số 39, cụ thể là bản 39.0.2171.65
Lỗi này phát sinh được dự đoán một phần do độ phân giải màn hình, một phần khác nhiều khả năng hơn là do lỗi lập trình chuẩn của thiết kế viên bỏ qua những chỗ mà thông thường các trình duyệt đều hiển thị đúng.


Facebook là một trong những trang web có lượt truy cập nhiều nhất thế giới cũng bị lỗi hiển thị trên chrome mới

Tuy nhiên, hãy khoan đổ lỗi cho Lập trình viên, cho Chrome,.. trong bài viết này chúng ta sẽ đề cập đến việc khắc phục lỗi đó từ các khía cạnh khác nhau như thế nào.

I. Với phương diện người dùng, theo chia sẻ của Admin diễn đàn đồ họa vietdesigner, có 2 cách khắc phục.

Cách thứ nhất, đơn giản và không mất công suy nghĩ, đó là chờ bản cập nhật thứ 40 của chrome hoặc tải bản chrome 38 về tại địa chỉ:
http://dl.google.com/chrome/win/38.0.2125.101_chrome_installer.exe
Tuy nhiên cách này có vẻ như không mấy khả quan lắm khi mà chúng ta ngày ngày giờ giờ sử dụng trình duyệt này để duyệt web, online,..


Một website bị lỗi hiển thị css trên chrome bản cập nhật thứ 39

Cách thứ hai, Enable một vài tính năng thử nghiệm trong Chrome Flags, cách làm như sau:
1 - Trên thanh địa chỉ, gõ:
chrome://flags



2 - Tìm phần Tắt(Disable) DirectWrite và ấn chọn Bật(Enable)



3 - Khởi động lại Chrome.

Hai cách trên, được chỉ định dành cho người dùng, và tất nhiên là không có cách nào được khuyến khích. Nhưng biết làm sao được. Đành phải vậy thôi.

II. Với phương diện là những coder, designer, thì hiển nhiên chúng ta sẽ sửa theo cách riêng của chúng ta.
1 - Như hình minh họa thứ hai, websiste bị lỗi css khá nhiều trên thanh menu. Chúng ta hãy click chuột vào các chỗ lỗi và mở developer tools của chrome lên:



2 - Tìm đến các class/id css bị lỗi hiển thị trong file css



3 - Thêm đoạn thuộc tính css sau vào class/id đang bị lỗi:

white-space: nowrap;



4 - Save css lại.

Người dùng của bạn sẽ chẳng phải khó chịu khi vào một trang web toàn lỗi css nhìn không bắt mắt nữa.

Css trên Chrome bị lỗi và cách khắc phục​

Trên đây là một số cách để mọi người tham khảo, có thể còn nhiều cách đơn giản khác, nhưng hi vọng nó sẽ giúp ích cho các bạn trong khi duyệt web và thiết kế web.

P/s: Tất nhiên còn một cách nữa, không phải mất nhiều công sức như 3 cách trên. Đó là thay vì sử dụng chrome, hãy sử dụng Firefox để duyệt web .

Nguồn: Css trên Chrome bị lỗi và cách khắc phục
Vui lòng ghi rõ nguồn nếu bạn post lại bài viết này ở nơi khác.
Xin cảm ơn​

 

Nếu như bạn có 1 chút kiến thức về thiết kế web thì sửa mấy lỗi này nhanh gọn mà, đâu cần support đến đơn vị thiết kế web đâu