Post Archive

› October 28, 2003

Text-Shadow in Safari 1.1

  • Reported by kapowaz

The recently released new version of Mac OS X, 10.3 now includes Safari 1.1, the most recent version of Apple's web browser. Amongst the enhancements in this version are support for the CSS level 3 text-shadow property, rgba() colours with alpha values, and the ::selection pseudo-element. Frank Limbacher has put together an excellent little demonstration piece of two of these properties in effect (Screenshot available here for those without 10.3).

As has been pointed out, Internet Explorer has supported text-shadows for some time, but only via a proprietary pseudo-style filter. Apple seem to be pushing the bar even further than Mozilla; how long will it be before Firebird et al support these properties, I wonder?

(Hat tip: Todd Dominey)

Comments

1. October 28, 2003 09:30 AM

Quote this comment

liorean Posted…

This feels like a statement from Apple to the other browser makers: There's another player in this game, and they're serious about it!

Nice to see Apple join up in the standards implementation race... seems funny that there is so much difference in what CSS3 features are implemented by the different browser makers, however. Opera, Mozilla and Apple seems to have entirely different priorities. One has to wonder what Microsoft will contribute with Windows Explorer in Longhorn...

2. October 28, 2003 09:59 AM

Quote this comment

Anne Posted…

::moz-selection is also available for Mozilla, as well as -moz-opacity. Does Safari render these test cases correct: http://bugzilla.mozilla.org/show_bug.cgi?id=176170 (you have to modify them first if Safari supports it as ::selection or ::-khtml-selection)?

I love text-shadow BTW, it is brilliant and that screen shot looks really good!

3. October 28, 2003 01:10 PM

Quote this comment

liorean Posted…

Well, CSS3 property opacity is a whole different thing than the opacity provided by RGBA colour values. RGBA colour is far more versatile as it doesn't operate on a whole-element basis, but rather on individual colour values.

4. October 28, 2003 06:38 PM

Quote this comment

jackal Posted…

I absolutely love the shadowing! Like liorean said, Apple seems to be pushing its way into the browser market with Safari... I'm looking foward to see how Microsoft and Mozilla handle the text shadowing, and any other CSS implementation like this one.

Its also nice having backwards compatable accessable (and stylish) headings now... hopefully no one will go overboard on things like this, or else we'll be back to square one with CSS instead of JavaScript this time.

5. October 30, 2003 05:11 PM

Quote this comment

Robbert Broersma Posted…

That example looks amazing!
I'm going to borrow my neighbours PowerBook to enhance some of my sites...

6. October 30, 2003 06:48 PM

Quote this comment

Eddie Posted…

I'm just worried about the day this becomes implemented in ie... there won't be a webpage without it after that... it'll be like that wonderful blink tag.

7. October 31, 2003 05:54 AM

Quote this comment

liorean Posted…

Well, in difference from the blink tag, this has some really good usage possibilities. The blink tag was purely annoying. This is after all a consistent effect, and doesn't move anything like the blink and marquee elements do.

8. October 31, 2003 07:31 AM

Quote this comment

Anne Posted…

BLINK is back! :-)

As for RGBA, Mozilla has (some) HSL and HSLA support.

9. October 31, 2003 02:50 PM

Quote this comment

liorean Posted…

Yeah, the css parser support them, but they haven't fixed RGBA and HSLA in the rendering engine yet. Only HSL. Oh, and you can turn off both the blink and the marquee elements in mozilla using UserContent.css.

Oh, and look at what Dave Hyatt just added to Safari