I hope someone knows what is causing this.

If you use IE look at www.vciparts.com (http://www.vciparts.com), each line of the text on the big red pill button gets shaved from the top and bottom.

Here's my HTML
<a class="button" href="pnsearch.php">
<span class="value1">Part</span> <span class="value2">Search</span>
</a>

Here's my CSS
/* ##### Button ##### */
#mainContent>p>a.button{
display:block;
position:relative;
margin:1em;
width:150px;
height:90px;
border-bottom:none;
background-image:url(../images/pill.gif);
}
#mainContent a.button .value1{
position:absolute;
bottom:56px;
right:43px;
font-size:30px;
}
#mainContent a.button:hover .value1{
position:absolute;
bottom:54px;
font-size:29px;
}
#mainContent a.button .value2{
position:absolute;
bottom:22px;
right:23px;
font-size:30px;
}
#mainContent a.button:hover .value2{
position:absolute;
bottom:21px;
font-size:29px;
}
#mainContent a.button:hover{background-image:url(../images/pill2.gif); border-bottom:none;
}
/* ##### end button ##### */

Can anybody help ... PLEASE.

~ Mo

Set a suitable line-height, say line-height:1em; to those spans.
btw, have you checked your page in IE6?

Thanks, that did it.
(an yes, I have seen it in IE6. That's the next thing to tackle.)

~ Mo