html em phân tích lỗi trong chrome

Question

mã là ở đây cũng như: http://jsfiddle.net/wMfMT/5/

này khối đơn giản của html:

<div> 
    <em><em><em><em><a href="#">fifth</a></em></em></em></em> 
    <em><em><em><a href="#">fourth</a></em></em></em> 
    <em><em><a href="#">third</a></em></em> 
    <em><a href="#">second</a></em> 
    <a href="#">first</a> 
</div> 

và css này:

em {font-size:1.2em} 

làm cho chính xác trên Firefox (mỗi từ có kích thước khác nhau), nhưng không chính xác trên Chrome (thứ năm và thứ tư có cùng kích thước). Trước tiên tôi nghĩ đó là một vấn đề css, nhưng sau đó tôi kiểm tra html và nó bật ra rằng Chrome render nó như sau:

<div> 
    <em> 
     <em> 
      <em> 
       <em> 
        <a href="#">fifth</a> 
       </em> 
      </em> 
     </em> 
<!-- /em missing --> 
     <em> 
      <em> 
       <em> 
        <a href="#">fourth</a> 
       </em> 
      </em> 
     </em> 
     <em> 
      <em> 
       <a href="#">third</a> 
      </em> 
     </em> 
     <em> 
      <a href="#">second</a> 
     </em> 
     <a href="#">first</a> 
    </em><!-- this is the lost /em --> 
</div> 

Câu hỏi của tôi là:

1. là html của tôi đúng (là nó OK theo tiêu chuẩn để làm tổ em-s?)
2. nếu có thì có cách giải quyết khác không? *
3. đây có phải là lỗi đã biết và nếu tôi không nên báo cáo nó ở đâu?

*) Tôi có mã này trong plugin WordPress, và nhiều người tùy chỉnh nó bằng cách thêm css của riêng mình, do đó thay đổi từ em thành span hoặc bất cứ điều gì khác sẽ phanh trang web của họ. Tôi đang tìm một cách giải quyết mà không cần phải thay đổi css

gia tăng về báo cáo lỗi tại địa chỉ: http://code.google.com/p/chromium/issues/detail?id=126096

Answer 1

HTML của bạn có vẻ là đúng và tôi có thể tái tạo nó trên Chrome Canary xây dựng.

Một cách giải quyết sẽ được sử dụng nhịp: http://jsfiddle.net/PeeHaa/tCPd8/

tôi không biết cho dù đó là một vấn đề được biết đến, nhưng bạn có thể kiểm tra buglist tại http://code.google.com/p/chromium/issues/list

Nếu bạn cũng có Safari chạy bạn có thể cũng kiểm tra trình duyệt đó xem liệu đó có phải là lỗi Webkit hay Chrome hay không.

CẬP NHẬT

*) Tôi có mã này trong một plugin WordPress, và nhiều người tùy chỉnh nó bằng cách thêm css riêng họ, do đó thay đổi từ em để span hoặc bất cứ điều gì khác sẽ phanh trang web của họ. Tôi đang tìm giải pháp thay thế mà không cần thay đổi css

Tôi không thấy bất kỳ khả năng nào vì trình duyệt chỉ hiển thị sai, vì vậy bạn không thể sử dụng nó. Chỉ hack tôi thấy là sử dụng javascript để thay thế mức cao nhất em với một khoảng với cùng một kiểu dáng gắn liền với nó.

UPDATE2

Như James Allardice đã lưu ý bạn có thể bọc những thứ trong một khoảng để khắc phục vấn đề nếu đó là ok cho plugin của bạn.