Hola,
Llevo 3 horas "loco" intentando buscar la solución para poner una sombra en el texto y que funcione en todos (o los más conocidos) navegadores. En Firefox, Chrome e incluso Safari me funciona pero el IE como siempre
He intentado hacer de todo lo que he podido encontrar e investigar .. pero no hay manera. He conseguido mostrar una sombra con IE pero luego no puedo combinarlo para que en Firefox o Chrome no aparezca el IE y sí el suyo.
Podéis ayudarme?
gracias,
Código:
<html>
<head>
<link href='http://fonts.googleapis.com/css?family=Maiden+Orange' rel='stylesheet' type='text/css'>
<style>
.shadow3 {
text-shadow:#666666 3px 3px 3px;
}
.shadow3_IE {
color:#7764a7;
zoom: 1;
background-color: #cccccc;
filter: progid:DXImageTransform.Microsoft.Chroma(Color=#cccccc)
progid:DXImageTransform.Microsoft.DropShadow(OffX=3, OffY=3, Color=#ccdbcc);
}
.shadow4 {
color:#7764a7;
<!--[if !IE]>
zoom: 1;
background-color: #cccccc;
filter: progid:DXImageTransform.Microsoft.Chroma(Color=#cccccc)
progid:DXImageTransform.Microsoft.DropShadow(OffX=3, OffY=3, Color=#ccdbcc);
<![endif]-->
text-shadow:#666666 3px 3px 3px;
}
#titulo1
{
font-family: 'Maiden Orange', sans-serif;
font-size: 50px;
}
</style>
</head>
<body>
<p id="titulo1"class='shadow'>pruebaLo.com</p>
<!--[if !IE]> <p id="titulo1" class='shadow3'>pruebaLo.com</p> <![endif]-->
<!--[if IE]> <p id="titulo1" class='shadow3_IE'>pruebaLo.com</p> <![endif]-->
</body>
</html>