Firefox: CSS text outline or shadow?

LincLinc OwnerDetroit Icrontian
edited March 2005 in Internet & Media
Anyone know how to apply ANY type of outline or shadow to text using CSS that will show up in Firefox? And, I need it in 5 lines of code or less - I've found 20+ line hacks that are ridiculous to try and implement for what I'm doing. Space is at a premium, and it has to be straight CSS - Javascript hacks don't help either.

For once, I'm wishing it handled this ability like IE does. :(

Comments

  • RWBRWB Icrontian
    edited March 2005
    I'd like to help out, but maybe some more information is needed, shadow and outline in css? I honestly never tried them ever myself. Could you show me what you've found so far? Or show me the actual end look you're going for?

    I'm finishing up my own site atm :D
  • LincLinc Owner Detroit Icrontian
    edited March 2005
    Well, the official CSS command is "text-shadow", but there is NO support for it on any browser.

    I've found the "filter" abilities in IE can duplicate it. I used an example from lsevald to come up with "filter: glow(Color=#000000,Strength=2);" which works for adding shadow effects in IE only - Firefox won't recognize filter attributes. It looks so cool, but I can't get a duplicate or near-duplicate effect of any kind in Firefox no matter what I try.

    Examples of filters: http://www.fred.net/dhark/demos/css/css_filter_examples.html

    Glow is sixth on that page. Note that they won't work unless you view the page with IE.

    Thanks for taking a look :)
  • RWBRWB Icrontian
    edited March 2005
    heh, I didn't even know that stuff existed! Interesting, but I don't think any of them look too good. Hopefully someone here knows the answer cuase I don't.
  • LincLinc Owner Detroit Icrontian
    edited March 2005
    It was a poor application for the effects to be sure, but the glow looks pretty hot when applied modestly to things like folding sigs ;)
  • TBonZTBonZ Ottawa, ON Icrontian
    edited March 2005
    Wish I could help you Matt, I ran into the same problem with my scroll bar attributes not being recognized in FF. :(
  • bugmenotbugmenot
    edited March 2005
    General Keebler wrote:
    Anyone know how to apply ANY type of outline or shadow to text using CSS that will show up in Firefox? And, I need it in 5 lines of code or less - I've found 20+ line hacks that are ridiculous to try and implement for what I'm doing. Space is at a premium, and it has to be straight CSS - Javascript hacks don't help either.

    For once, I'm wishing it handled this ability like IE does. :(

    Try making the same text in a bigger font lower in the z-order...
  • danball1976danball1976 Wichita Falls, TX
    edited March 2005
    A comparison between Firefox 1.0.1 and IE 6

    Firefox is on the left and IE on the right
  • a2jfreaka2jfreak Houston, TX Member
    edited March 2005
    If IE supported PNG properly then this wouldn't be as big of a deal . . . just make the stuff in PNG.

    Notice, it isn't like IE does this via CSS, it does it via a hack: filter. This hack won't work on all images, from my experience; only on images included via the < img > tag. Have an image as a background and this hack doesn't work.

    Solution:
    1) Make both browsers support CSS1 & CSS2 completely.
    2) Make IE properly support the alpha channel in PNG images.
Sign In or Register to comment.