Hola!
Les cuento lo que me ocurre:
Tengo un select al que debo aplicarle un diseño, para lo que codifiqué el
markup:
<div>
<span>Elemento seleccionado</span>
<select>
<option></option>
[...]
</select>
</div>
El select lo hice invisible y mediante javascript el valor del option
seleccionado pasa al span para que sea legible al usuario.
Quien tiene aplicado el diseño es el div. El span está posicionado de forma
absoluta.
CSS del div:
div.select_wrapper {
background: url(../../eldiseñofantastico.png) no-repeat 0 0;
padding: 0;
margin: 3px 0 0;
width: 282px;
position: relative;
}
del span:
div.select_wrapper span.selection {
position: absolute;
padding: 4px;
color: #121419;
z-index: 10;
top: 0;
left: 0;
line-height: 17px;
}
y del select:
div.select_wrapper select {
opacity: 0;
-moz-opacity: 0;
filter:alpha(opacity=0);
width: 282px;
height: 22px;
}
En Chrome, Chromium y FF5 se comporta bien: en todos los demás: IE7, IE8,
Opera, Safari, FF3 (tanto en windows como en mac) solo funciona en el primer
select, y el segundo no muestra el span.
Bueno, si gustan pueden verlo funcionar en
http://sampoerna.magrio.net/quejasaeromexico
Yo siento que el problema está en el posicionamiento, pero no doy con la
solución.
¿Me ayudan? :D
Gracias.
--
*magrio*alvarez
desarrollador*web*
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
