I've looked at countless fixes from display:inline to margin:1 auto - you name it, I think I've tried it.
http://www.weil-mclain.com/HVAC/matrix2.html

In Firefox the hover works great. It brings up the info box to the bottom right corner of the question mark. In IE however, its all the way to the right
sometimes off the screen depending on how large your monitor is.

CSS is as follows (please keep in mind I will be linking to this style sheet out of a styles folder. It will not remain in the html page. )


body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}

div#set_of_links {
position:absolute;
}
div#set_of_links img {
position:fixed;
right: 665px;
top: 240px;
margin: 0;
border-style: none;
}

div#set_of_links p {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:black;
}

div#set_of_links a {
display:inline;
text-decoration:none;

}
div#set_of_links a:hover {
background:transparent
}
div#set_of_links a span {
display:none;
margin: 0px 0px 0px 450px;
}
div#set_of_links a:hover span {
float: left;
width: 200px;
height: auto;
margin: 0px 0px 0px 450px;
display: inline;
border: #005295;
border-style: solid;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
background-color: #ffffff; /* the background */
filter:alpha(opacity=75); /* Internet Explorer */
-moz-opacity:0.75; /* Mozilla 1.6 and below */
opacity: 0.75; /* newer Mozilla and CSS-3 */
padding:5px 10px 5px 10px;
}

div#seer_sel {
position:absolute;
margin-bottom:20px
}
div#seer_sel img {
display:inline;
position:fixed;
left: 290px;
top: 380px;
margin: 0;
border-style: none;
}

div#seer_sel p {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:black;
}

div#seer_sel a {
display:inline;
padding: 0px 0px 20px 0px;
text-decoration:none;
border-style:none;

}
div#seer_sel a:hover {
background:transparent
}
div#seer_sel a span {
display:none
}
div#seer_sel a:hover span {
display:inline;
position:absolute;
margin: 0px auto;
border-style: none;
border: #005295;
border-style: solid;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
background-color: #ffffff; /* the background */
filter:alpha(opacity=75); /* Internet Explorer */
-moz-opacity:0.75; /* Mozilla 1.6 and below */
opacity: 0.75; /* newer Mozilla and CSS-3 */
padding:5px 10px 5px 10px;
width: 200px;
}

select {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
border: #56514C;
border-style: solid;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
width: 100px;
}

I checked validation too and what I mostly found were missing background tags. The excessive use of tables was done by the guy who designed the site. The header and footer that I see when I code is in a wrapper - like a php include. The back-end is a disaster too - but thats another story. Thanks for your explanation - I don't expect miracles.

::Edit::
I checked the validation service that you linked too and MAN O MAN - what a mess indeed. This was the one I used yesterday that didn't clue me in to anything W3 CSS Validation. So let me fix this junk and get back to this later. I really need to run the validation you suggested on the remainder of this site - I knew it was programmed bad, but this is ridiculous.