Html em parsing error in chrome

The code is also here: http://jsfiddle.net/wMfMT/5/

This simple html block:

<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>

and this css:

em {font-size:1.2em}

Firefox displays correctly (each word has a different size), but incorrectly in Chrome (the fifth and fourth are the same size). At first I thought it was a css problem, but then I inspected the html and it turned out that Chrome did it like this:

<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>

My questions:

  • is my html correct (is this ok according to the standard for em-s socket?)
  • if so, is there a workaround? *
  • This is a known mistake, and if not, where should I report it?

*) I have this code in the WordPress plugin and many people tweaked it by adding their own css, so switching from em to space or something else slows down their sites. I am looking for a workaround without having to change css

bugreport : http://code.google.com/p/chromium/issues/detail?id=126096

+5
1

HTML , Chrome Canary build.

: http://jsfiddle.net/PeeHaa/tCPd8/

, , http://code.google.com/p/chromium/issues/list

Safari, , , Webkit Chrome.

UPDATE

*) WordPress, , css, em - . css

, , . , , javascript, em span , .

UPDATE2

, , , .

+1

All Articles