Firefox 3.6 BUG and dunno really why

So. I searched feltway the whole Internet for a solution to my problem. But I haven’t found anything.

I’m currently working on a website which should be burned on CD later.

The specs are simple:

• HTML 5
• Nested Links
• Solved with TYPO3

So I got a call today that the website is looking akward in FF 3.6 and I was searchin for hours how this could come, ‚cause I really did browsertesting ’nd stuff and everything looks fine in IE (9,8,7) and FF and Opera & Chrome and last but not least Safari.

The structure as follows:

<div id="sitemap">
  <ul>
    <li>
      <a href="xxx">
        <h2>ABC</h2>
        <div id="c69">
          <ul>
            <li>xxx</li>
            <li>xxx</li>
            <li>xxx</li>
          </ul>
        </div>
      </a>
    </li>
  </ul>
</div>

In DOM / Firebug it looks like this creeping:

<ul>
  <li>
    <a href="xxxxxxx">xX</a>
    <h2>xxx</h2>
     <div id="c69">xxx</div>
  </li>
</ul>

Has anybody a solution?
I tried with JavaScript and HTML implementing and doctype and so on, also with a wrapping DIV I tried.
But nothing’s working.

And another thing is that this only happens on the second treelevel, I looked at my typoscript, but I found nothing special.
It can’t have to do with html 5 in this case, ‚cause all the other sites are working perfectly!

Here some screens: