Page 1 of 1
How do you dropshadow text in IE?
Posted: Fri Apr 05, 2013 7:17 am
by simonmlewis
I know how to add shadow to Firefox text. It's relatively easy.
But I've never discovered how within the same class, to do it to IE9 as well.
Plus, is there a way for the "hover" state to move the text down a pixel and right a pixel - to give the impression of it being pushed down?
Re: How do you dropshadow text in IE?
Posted: Fri Apr 05, 2013 4:17 pm
by social_experiment
Re: How do you dropshadow text in IE?
Posted: Fri Apr 05, 2013 4:26 pm
by simonmlewis
Everything I am reading, and trying there, fails in IE9.
Re: How do you dropshadow text in IE?
Posted: Fri Apr 05, 2013 6:00 pm
by social_experiment
Code: Select all
<!doctype html>
<html lang="en" >
<head>
<meta charset="utf-8" >
<title>Test</title>
<style >
#myelement {
color: #000000;
text-shadow:
-1px -1px 0 #ffffff,
1px -1px 0 #ffffff,
-1px 1px 0 #ffffff,
1px 1px 0 #ffffff;
}
p#myelement {
filter: progid:DXImageTransform.Microsoft.Chroma(color='red') progid:DXImageTransform.Microsoft.Alpha(opacity=100) progid:DXImageTransform.Microsoft.dropshadow(color=#ff0000,offX=1,offY=1) progid:DXImageTransform.Microsoft.dropshadow(color=#ff0000,offX=-1,offY=1) progid:DXImageTransform.Microsoft.dropshadow(color=#ff0000,offX=1,offY=-1) progid:DXImageTransform.Microsoft.dropshadow(color=#ff0000,offX=-1,offY=-1);
zoom: 1;
}
</style>
</head>
<body>
<h1>Hello World</h1>
<p id="myelement" >Hello World</p>
</body>
</html>
weird; i got a red drop-shadow with this snippet. From the few pages i read there is a jQuery alternative for IE9.
Re: How do you dropshadow text in IE?
Posted: Wed Apr 10, 2013 10:01 am
by simonmlewis
This doesn't work in IE9. I literally copied all you entered.
Re: How do you dropshadow text in IE?
Posted: Wed Apr 10, 2013 10:31 am
by simonmlewis
http://www.cssportal.com/css3-text-shadow-generator/
This page when running directly from IE9 doesn't work.
Is there something in IE9 that has to be changed at my end??
Re: How do you dropshadow text in IE?
Posted: Wed Apr 10, 2013 4:17 pm
by Christopher
This seems to work for me in Firefox, Chrome and IE10 but perhaps not IE9 (does not work in Compatibility View). The web would be a much better place without IE.
Code: Select all
<!doctype html>
<html lang="en" >
<head>
<meta charset="utf-8" >
<title>Test</title>
<style >
.shadow {
text-shadow:1px 1px 1px red; /* CSS3 */
filter: Shadow(Color=red, Direction=130, Strength=1); /* IE Proprietary Filter*/
}
</style>
</head>
<body>
<h1>Hello World</h1>
<p class="shadow" >Hello World</p>
</body>
</html>
Re: How do you dropshadow text in IE?
Posted: Thu Apr 11, 2013 3:30 am
by simonmlewis
So IE9 just doesn't do it at all, but now IE10 does (even tho the majority don't use it).
Ok thank you.
Re: How do you dropshadow text in IE?
Posted: Thu Apr 11, 2013 4:20 am
by social_experiment
simonmlewis wrote:So IE9 just doesn't do it at all
the ie9 i use does. When the page loads it asks to allow activeX controls or block content. If allowed it displays the dropshadow; this page
http://www.cb.restaurantconnectinc.com/ also uses the drop-shadow effect; it doesn't look particularly good but it does display
Re: How do you dropshadow text in IE?
Posted: Wed Oct 09, 2013 12:52 pm
by penweb
Wasn't IE9 deprecated? Lol. Sorry, I just hate that browser so much I just dont even worry about it anymore. Tell your customers to upgrade!
Re: How do you dropshadow text in IE?
Posted: Wed Oct 09, 2013 10:17 pm
by requinix
penweb wrote:Wasn't IE9 deprecated? Lol.
Depends how you define "deprecated". End of life? Not even close. Superseded by another version? Sure. No longer in use? Hardly.
penweb wrote:Tell your customers to upgrade!
