...

View Full Version : Table cell color fading with CSS



ssskaya
03-06-2004, 11:44 AM
On msn.com, thay have headlining table cells in a different color, which is fading as you go down to the bottom.

I took a look at the script of the defined css class, which said:

.dt {padding: 1px 4px 2px 1px; color: #FFFFFF; }
.dt {filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC6600, endColorstr=#E4AF79); background-color: #CC6600; }
.dt {filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#963455, endColorstr=#C894A6); background-color: #963455; }
.dt {filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#08A808, endColorstr=#7DD17D); background-color: #08A808; }
.dt {filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#2B804C, endColorstr=#90BCA1); background-color: #2B804C; }
.dt {filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#E8362B, endColorstr=#F39590); background-color: #E8362B; }
.dt {filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#9E4040, endColorstr=#CC9B9B); background-color: #9E4040; }
.dt {filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC6600, endColorstr=#E4AF79); background-color: #CC6600; }
.dt {filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#684648, endColorstr=#B09FA0); background-color: #684648; }
.dt {filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFBA00, endColorstr=#FFDB79); background-color: #FFBA00; }
.dt {filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#D1A700, endColorstr=#FFDB79); background-color: #D1A700; }
.dt {filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#9060B9, endColorstr=#C5ACDA); background-color: #9060B9; }
.dt {filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#635190, endColorstr=#ADA4C5); background-color: #635190; }
.dt {filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#446CC0, endColorstr=#9DB2DE); background-color: #446CC0; }
.dt {filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#1835A0, endColorstr=#7B8BC9); background-color: #1835A0; }
.dt {filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0266A8, endColorstr=#7AAFD1); background-color: #0266A8; }


I don't know anything about this above, so I would like to know if that's the only way to do it.

Thanks.

me'
03-06-2004, 02:12 PM
Horrible, no? Loads of classes using non-validating IE proprietry muck.

The easiest way to do it would be to grab an image of the gradient you want (easy to create) and tile it using background-image.

mindlessLemming
03-07-2004, 01:09 AM
Filter: proprietry:garbage:no-thanks IE;
:o



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum