#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2004
    Posts
    3
    Rep Power
    0

    Exclamation CSS and Transparency


    Hi,

    I would like to have al my boxes and td's, tr's, table's and other frames transparant.

    Can i do this with CSS only?

    You can view my site @ www.linuxhelp.be , the penguin has to be full seen!

    With a friendly greet,

    Dieter Van Houtte
  2. #2
  3. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    May 2003
    Posts
    56
    Rep Power
    12
    I don't know what you mean by boxes, but...
    Code:
    table, tr, td, div, span, p { background-color: transparent; }
  4. #3
  5. Retired
    Devshed Supreme Being (6500+ posts)

    Join Date
    Feb 2002
    Location
    Finland
    Posts
    9,143
    Rep Power
    2494
    You could also get away without having any color for the backgrounds.
    You seem to be a bit confussed as to what kind of document you are outputting:
    You include <?xml version="1.0"?>, but you use old style <body> settings. eg leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"

    Try setting this stuff in your stylesheet. Set thebackground in the body {} and then for your td's etc. done use a background color at all. It is maybe not the best, but you can get through the CSS validator even with no background color. Of course, you can also use Glides suggestion, though that doesn't work in NET**** 4.7 and below - big deal anyway

    Cheers,
    Jamie

    >_ skiFFie ? | Twitter

    __________________

    Let the might of your compassion arise to bring a quick end
    to the flowing stream of the blood and tears .....
    Please hear my anguished words of truth.

    __________________
  6. #4
  7. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2004
    Posts
    3
    Rep Power
    0
    Originally Posted by Glide
    I don't know what you mean by boxes, but...
    Code:
    table, tr, td, div, span, p { background-color: transparent; }
    This doesn't work ==> http://www.linuxhelp.be

    Do you see the tux-penguin?

    Thanx,

    Dieter
  8. #5
  9. Retired
    Devshed Supreme Being (6500+ posts)

    Join Date
    Feb 2002
    Location
    Finland
    Posts
    9,143
    Rep Power
    2494
    Try first this:
    Code:
    .contentheading, .componentheading {
      font-family      : Verdana, Arial, Helvetica, sans-serif;
      font-size        : 11px;
      font-weight      : bold;
      color            : #4490B4;
      text-align       : left;
      background-color: transparent;
    }
    You have misspelled transparent .)

    Cheers,
    Jamie

    >_ skiFFie ? | Twitter

    __________________

    Let the might of your compassion arise to bring a quick end
    to the flowing stream of the blood and tears .....
    Please hear my anguished words of truth.

    __________________
  10. #6
  11. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2004
    Posts
    3
    Rep Power
    0
    Originally Posted by jabba_29
    Try first this:
    Code:
    .contentheading, .componentheading {
      font-family      : Verdana, Arial, Helvetica, sans-serif;
      font-size        : 11px;
      font-weight      : bold;
      color            : #4490B4;
      text-align       : left;
      background-color: transparent;
    }
    You have misspelled transparent .)
    Oh,

    LOL

    It works now!!
    I'm belgian, so thats the reasen of the misspelled transparEnt

    THANX !!!!!!!

    Dieter
  12. #7
  13. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    May 2004
    Posts
    1
    Rep Power
    0
    You could also use mozilla's and IE's propriatery way of doing this until the CSS3 property 'opacity' gets better support. IE uses it's filter (alpha), whiloe moz uses -moz-opacity. You can combine them both in the same CSS rule.
    This is described in CSS Transparency.

IMN logo majestic logo threadwatch logo seochat tools logo