Tooltip con CSS no funciona en IE y FF

[sadzas]

Que tal?

Que sucede con Firefox y IE ?? me funciona barbaro en Chrome! pero estoy a las puteadas con IE! tengo que programar algo para TODOS los navegadores y hacer una version especial para el F*cking IE!!!

MALDITO MICROSOFT!!!!!

Ok, ya me calme! les cuento el problema:

Estoy haciendo un tooltip en CSS y la verdad es que con Chrome me funciona barbaro, pero no asi con IE y Firefox. Por tanto, debo pensar que el problema lo tengo yo, les muestro el codigo:

Mi CSS

Código:

.tooltip
{
        font-family: Geneva, Arial, Helvetica, sans-serif;
        font-size: 10px;
        font-style: normal;
        font-weight: normal;
        color: #006699;
}               

.tooltip:hover
{
        text-decoration:none;
}

.tooltip span      
{
        display:none;
        margin:15px -10px -10px -10px;
        padding:2px 2px;
}

.tooltip:hover span
{                
        display:inline;
        position:absolute; 
        border:1px solid #cccccc;
        background:#6699FF;
        color:#FFFFFF;
        font-size: 11px;
}

Y ahora donde tengo puesto el tooltip:

Código:

<th width="36%" scope="row" class="tooltip" align="left">Extension Number<span>The extension number to dial to reach this user.</span></th>

Donde cometo el error?


Gracias a todos por leer mi problema!

[kseso?]

Y ¿qué es exactamente lo que no funciona? ¿Cuál es el funcionamiento correcto y el que le sucede?

Como sugerencia, aísle el código (libre de tablas y todo el html y con sólo el css que le afecta diréctamente) para evaluarlo.

O haga una búsqueda por tooltip+css, hay muchas realizaciones al respecto. Una de ellas, que le menciono por lo sencillo del código) el la que encontrará en www.araudi.net.

Atentamente