Text-Schatten browserübergreifend

[Markus]

Tach!

Ich hab jetzt mal folgendes probiert:

<table border="0" cellspacing="0" cellpadding="3" width="100%">
    <tr>
     <td align="center">

<div id="HLayer" style="position:relative;>
<div id="Layer1" style="position:absolute; left:1px; top:1px; color:#FFFFFF; font-size:24px; font-family:Verdana, Arial, Helvetica, sans-serif;">Hallo</div>
<div id="Layer2" style="position:absolute; left:0px; top:0px; color:#354A69; font-size:24px; font-family:Verdana, Arial, Helvetica, sans-serif;">Hallo</div>
</div>

</td>
    </tr>
   </table>

Wenn ich den Sinn von lyern verstanden habe, sollte es funktionieren. Tut es aber nicht. Noch eine Möglichkeit wäre folgende:

<table border="0" cellspacing="0" cellpadding="3" width="100%">
    <tr>
     <td align="center">

<div id="Layer1" style="position:relative; left:1px; top:30px; color:#FFFFFF; font-size:24px; font-family:Verdana, Arial, Helvetica, sans-serif;">Hallo</div>
<div id="Layer2" style="position:relative; left:0px; top:0px; color:#354A69; font-size:24px; font-family:Verdana, Arial, Helvetica, sans-serif;">Hallo</div>

</td>
    </tr>
   </table>

Die Schrift wird so angezeigt wie ich es haben möchte. Allerdings ist dann ein fetter Rand über dem Text.

Auch nicht das Wahre. Hat jemand Ideen?

Gruss, Markus