Mozilla und das liebe display

[Froschpopo]

Hallo Forum!

Folgendes Problem(chen):

Ich erstelle ein Formular:

<form action="/target.aspx" method="post">
   <fieldset id="formular">
      <legend>Anmeldung</legend>
      <ol>
          <li>
              <label for="username">Username:</label>
              <input type="text" id="username" name="username">
          </li>
          <li>
              <label for="passwd">Passwort:</label>
              <input type="password" id="passwd" name="password">
          </li>
      </ol>
   </fieldset>
</form>

Das CSS sieht so aus:

#formular ol li label {
    display: inline;
    display: -moz-inline-box; /* vermutlich die PROBLEMZEILE */
    width: 140px;
}

#formular ol, #formular ol li {
    margin: 0; padding: 0;
    list-style: none;
}

Alle gängigen Browser stellen den Code einwandfrei dar.
Mit -moz-inline-box kann ich im Mozilla zwar keinen automatischen Zeilenumbruch erzwingen, aber den benötige ich in meinem Fall auch nicht.

Das Problem ist nun folgendes:
Wenn ich versuche innerhalb des <label>-Tags irgendwelche Formatierungen vorzunehmen, z.B. mittels <span>, dann stellt der Mozilla NUR den Inhalt innerhalb des <span>-Tags dar.

Ein kleines Beispiel:

<label for="username">Username:<span style="color:red">*</span></label>

löscht den kompletten Inhalt, AUSSER das rote Sternchen!

Das liegt definitiv an meinem -moz-inline-box-Hack.

Ich frage mich nur die ganze Nacht schon, worin hier ein Zusammenhang besteht. Der IE und andere Browser lassen eine label-formatierung innerhalb einer inline-box zu!! Warum Mozilla nicht?
Das problem ist für mich einfach logisch nicht nachvollziehbar.

Bitte nur kompetente Antworten und keine Hinweise auf Google ;)