#1
  1. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2003
    Posts
    2
    Rep Power
    0

    Question Wierd CSS filter problem


    I seem to be having a problem with CSS filters. What I want to do is to have a line of text with a CSS filter (glow for example), this text is in a table that has a background color. The table itself would have another filter on it (alpha for example). The result should be glowing text on a semitransparent background. The problem I am having is that the background for the text area becomes completely transparent whenever a filter is applied to the table. Here is some code to show my problem:
    Code:
    <html>
      <body>
        <table width=200 height=200 style="filter: alpha(opacity=60);">
          <tr>
            <td bgcolor=#808080>
              <center><span style="height: 1; filter: glow(color=red, strength=3);">HELLO!</span></center>
            </td>
          </tr>
        </table>
      </body>
    </html>
    If anyone could tell me what I'm doing wrong or if there is a workaround i would be thankful.
  2. #2
  3. Senior Polecat
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2003
    Location
    Jersey (the original version)
    Posts
    210
    Rep Power
    12
    You can't apply background colors and the glow filter to the same element and as the span is an inline element you'll need to fudge your table to get it to work:

    <html>
    <body>
    <table>
    <tr>
    <td bgcolor="#CCCCCC">
    <table width=200 height=200 style="filter: alpha(opacity=60);">
    <tr>
    <td>
    <center><span style="height: 1; filter: glow(color=red, strength=3); background-color: transparent;">HELLO!</span></center>
    </td>
    </tr>
    </table>
    </td>
    </tr>
    </table>
    </body>
    </html>
    Quidquid latine dictum sit, altum viditur.

    http://www.XSet.co.uk
  4. #3
  5. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2003
    Posts
    2
    Rep Power
    0
    Well, almost. The problem with this code is that the actual background color of the table must be transparent because it is on top of an image background. In your code the background of the table is not actually transparent, just the text.

IMN logo majestic logo threadwatch logo seochat tools logo