MikroSight.com

MikroSight.com

| Home | NPA/NPX |

Google
Web
MikroSight

Shadowed Table Tutorial - Page 6

Shadowed Tables - Page 1

Shadowed Tables - Page 2

Shadowed Tables - Page 3

Shadowed Tables - Page 4

Shadowed Tables - Page 5

Our style sheet contains these class definitions for the TD tag and correspond to the classes used in the HTML example above.  These work great for Internet Explorer, and normally work fine for Netscape, although with Netscape 4.7, we sometimes find we have to tweak things a little on the TOP and BOTTOM classes by adding  

background-position : bottom;

and sometimes we have to adjust the line-height for Netscape as well.


TD.top {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8pt;
color: #039;
background-color: #FFF;
background-image: url(../images/top.jpg);
background-repeat : repeat-x;
}

TD.left {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8pt;
color: #039;
background-color: #FFF;
background-image: url(../images/left.jpg);
background-repeat : repeat-y;
}

TD.right {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8pt;
color: #039;
background-color: #FFF;
background-image: url(../images/right.jpg);
background-repeat : repeat-y;
}

TD.bottom {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8pt;
color: #039;
background-color: #FFF;
background-image: url(../images/bottom.jpg);
background-repeat : repeat-x;
}


TD.contents {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10pt;
color: #009;
background-color: #FFF;
text-align: center;
}

Shadowed Tables - Page 7