Transparent Tables Cut Short? Options

[CrimsonSkyGraphi...]

Hey Everyone,

I'm working on a layout and would like the tables to be semi-transparent. I used the code I keep finding, but a glitch seems to happen when I hover over certain links in the boxes. It actually makes parts of other boxes disappear. It comes back when I refresh the page..and does it again. I've had this problem with other layouts that have this feature. Has anyone else noticed it?

Here's a screenshot: (Note how most of the About box is missing, and the bottom of Interests)



Here's the code:

CODE

<style type="text/css">

table, tr, td {background-color: transparent; border:0px; padding: 0px;width:440px;}

table table table {width:100%;}

table table table table {border:none;}

td td td td {width:1%; height: .01%; text-align:left;}

body {
background: 000000  url("[url="http://img177.imageshack.us/img177/7985/backgroundgk6.jpg"]http://img177.imageshack.us/img177/7985/backgroundgk6.jpg[/url]");
background-position: bottom center;
background-repeat: no-repeat;
background-attachment: fixed;
scrollbar-arrow-color: d3d3d3;
scrollbar-track-color: 000000;
scrollbar-shadow-color: 808080;
scrollbar-face-color: a9a9a9;
scrollbar-highlight-color: c6c6c6;
scrollbar-darkshadow-color:686868;
scrollbar-3dlight-color:d3d3d3;}

.navigationBar td td {border: 2px solid; border-color: ffffff; background-color: 000000; padding-left:5px; padding-right:5px; padding-top:5px; padding-bottom:5px;}

.navigationBar td td font {color:929493;}

TABLE, TD {padding: 0px; text-transform: none; width:700px;}

body, p, td, font {font-family: arial; font-size: 13px; color:929493; text-transform:none;}

table, td, tr, th {font-family:arial; font-size: 13px; color:929493;}

body, td, li, p, div, li, p, br, table {font-family: arial; color: 929493; text-transform:none;}

table {border: none; background-color: transparent;}

table table {border: none; background-color: transparent;}

table table table {border: 4px solid; border-color: 000000; padding: 0px;  background-image:url(""); background-color:000000;  filter:alpha(opacity=85); -moz-opacity:0.85; opacity:0.85; -khtml-opacity:0.85;  }

table table table table {border: none; border-color: none; background-color:transparent;}

b {color: 787878; text-transform: none; text-decoration: none; font-weight: bold;}

i, em {color: 787878; text-transform: none; text-decoration: none; font-weight: italic;}

u {color: 787878; text-decoration: underline; border-bottom: 1px solid; border-color:787878; font-weight: bold;}

.text {font-family: arial; font-size: 13px; color:929493; text-align:left;}

.redtext{font-family: verdana; color:787878; font-size: 11px; border-bottom:solid 0px; border-top:solid 0px;   border-color:ffffff; background-color:transparent; }

.redbtext {font-family: verdana; color: 787878; font-size: 16px;border-bottom:solid 0px; border-top:solid 0px;   border-color:ffffff; background-color:transparent;}

.orangetext15 { font-family: verdana; color: 787878; font-size: 16px; text-align: center; font-weight: normal; display:block;  visibility:visible; border-bottom: solid 0px; border-color: ffffff;  background-color:transparent; text-align:center; text-transform: uppercase;}

.whitetext12 {font-family:verdana; font-size: 16px; font-weight: normal; color: 787878; text-transform:uppercase; text-align: center; display:block;  border-bottom:solid 0px; border-top:solid 0px;  border-color:transparent; background-color:f6f6f6;}

.lightbluetext8 {font-family: verdana; font-size: 13px; color: 787878;font-weight: normal; text-transform:uppercase; text-align: center; display: block;  border-bottom:solid 0px; border-top:solid 0px;  border-color:ffffff; background-color:transparent;}

.btext {font-family: verdana; font-weight: normal; font-size: 16px; color:787878; text-transform:uppercase; text-align: center; display: block;  border-bottom:solid 0px; border-top:solid 0px;  border-color:ffffff; background-color:transparent;}

.blacktext10 {font-family:verdana; font-weight: normal; font-size: 16px; color: 787878; text-transform:uppercase; text-align: center; display: block;  border-bottom:solid 0px; border-top:solid 0px;  border-color:ffffff; background-color:transparent; width: 300px;}

.nametext {font-family: verdana; font-size: 16px; color:787878; font-weight: normal; text-transform:uppercase; text-align: center; border-bottom:solid  0px; border-top:solid 0px;  border-color:ffffff; background-color:transparent; display: block; width: 300px;}

input, select, textarea, .textfield, .button {
border: 2px solid;
border-color: ffffff;
background-color: 000000;
letter-spacing:0px;
color: 787878;}

.blacktext12 {font-family:verdana; font-weight:normal; text-transform:none; font-size:18px; color:ffffff;
padding-left:30px; padding-right:30px; padding-top:20px; padding-bottom:20px; text-align: center; width:400px; }

a:link, a:link font, a:active, a:active font, a:visited font, a.redlink:link, a.redlink:active, a.redlink:visited, a.interestsAndDetails, .interestsAndDetails .tdborder td a{font-family: arial; font-size: 13px; color: bababc;
background-color: e8e8e8; text-decoration: none; font-weight: normal;}

.tdborder td a {font-family: arial; font-size: 13px; color: bababc;
background-color: transparent; text-decoration: none; font-weight: normal;}

a:hover {font-family: arial; font-size: 13px; color: 585858; background-color: e8e8e8; text-decoration: none; font-weight: none;}

a.redlink:hover, .tdborder td a:hover  {font-family: arial; font-size: 13px; color: 585858;
background-color: transparent; text-decoration: none; font-weight: none;}

a.navbar:link, a.navbar:visited, a:visited {font-family: arial; font-size: 13px; color: bababc;
background-color: transparent; text-transform:; font-weight: normal; text-decoration: none; }

a.navbar:hover {font-family: arial; font-size: 13px; color: 585858;
background-color: transparent; text-transform:; font-weight: normal; text-decoration: none; border-bottom: 0px
solid;  border-top: 0px solid; border-left: 0px solid; border-right: 0px solid; border-color: 000000;}

a:link img {filter:none; border-color: 929493;} a:visited img {filter:none; border-color:929493;}  a:hover img {filter:none; border-color:929493;}

span.blacktext12 {
visibility:visible !important;
background-image:url("[url="http://img502.imageshack.us/img502/4688/bannerdo5.jpg"]http://img502.imageshack.us/img502/4688/bannerdo5.jpg[/url]");
background-color:000000;
background-repeat:no-repeat;
background-position:center;
width:415px; height:200px; display:block !important;
text-align: center; }

span.blacktext12 img {display:none;}

.contactTable {
background-image:url("");
background-position:center;
background-repeat:no-repeat; background-color:000000; width:304px; height:150px;}

.contactTable table, table.contactTable td { padding:0px !important;
border:0px; background-color:transparent; background-image:none;}

.contactTable a img {visibility:hidden; border:0px !important;}
.contactTable a {display:block; height:28px; width:115px;}
.contactTable .text {font-size:1px !important;}

.contactTable .text, .contactTable a, .contactTable img {filter:none !important;}.contactTable .whitetext12  {display:none;}

table table table td {vertical-align:top ! important;}

a.text, table div font a, table div div , td div font {visibility:hidden;}

table tr td div font {display: none;}

table td div {visibility:visable; align:center;}
table table td div {visibility:visible;}
tr {background:transparent;}</style>

<div-align=center><div style="position:absolute;left:0px;top:0px;width:120px;height:70px;"><a
href="[url="http://www.msplinks.com/MDFodHRwOi8vd3d3LnVuaXZlcnNlc2VyaWVzLmNvbS9jc2dyYXBoaWNz"]http://www.msplinks.com/MDFodHRwOi8vd3d3LnVuaXZlcnNlc2VyaWVzLmNvbS9jc2dyYXBoaWNz[/url]"
target="_blank">Layout by:<br>C.S.Graphics</a></div>

Thank you so much. =\ I really would love to have this effect, but that would bother me if I'm giving it to other people to use...