CSS text shadow

Inspired by the work of Ernie I was introduced to a CSS property called text-shadow. I’m throwing it out there for the benefit of those looking to expand their understanding of what’s possible with CSS. The result is the same as adding a drop-shadow to graphic text (right-left and upper-lower offsets, color, blur and even overlapping multiple shadows with different colors) except it’s html text which is good because you still maintain the benefits of searchable html.

Admittedly it has limited use since apparently Safari (no surprise) is the only browser that supports the text-shadow property straight from the box. The upshot is there’s a fairly simple (not my words) hack that will work (or degrade gracefully…IE Mac) in all the browsers although the info is about a year old so the fix may have changed for the various browsers. For those who want to investigate a little more here are some links:

The W3C has a very clear explanation about the property http:// www.w3.org/TR/REC-CSS2/text.html

This page has the hack http://www.workingwith.me.uk/articles/css/ cross-browser-drop-shadows

Or do a Google search for CSS text-shadows

This list is maintained by Softpress Systems - http://www.softpress.com

quote

To break it down a bit, "text-shadow" is the Name of the attribute, and is applied thru the Edit Styles>Extended window. The Value has four entries, "x-offset, y-offset, radius, and color". The completed entry would look like:

Name: text-shadow Value: 1px 2px 2px #c3d9ff

As a side note, there are 16 defined CSS color names that you can use when you find yourself adding color to something in the extended style window and the hex value escapes you. Those color names are: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow. So for every manually entered CSS attribute, you needn’t be forced to remember hex values for common colors.

[b:3566ecd2ca]Todd[/b:3566ecd2ca] wrote:[quote:3566ecd2ca] Inspired by the work of Ernie I was introduced to a CSS property called text-shadow. [/quote:3566ecd2ca]

Ernie Simpson Freeway 4 Pro User [url]http://www.thebigerns.com/freeway/[/url]

This list is maintained by Softpress Systems - http://www.softpress.com

quote

[quote:20bae9c0f4=”The Big Erns”]As a side note, there are 16 defined CSS color names that you can use when you find yourself adding color to something in the extended style window and the hex value escapes you.[/quote:20bae9c0f4]

Ooh, that’s cool.

Thanks, Ernie!

:D

quote