Hi,
I have added two images to my site with a mousover affect. The affect on the second code “headersignin” works fine. However the first piece of code "headerjoin
" is often jittery with the background image not always appearing.
Im not sure why though as they are both the same code set up. Does anyone have any suggestions on what this could be down to.
headerjoin
{
width: 76px;
float:right;
background-image:url('/images/joinimage.png');
background-repeat:repeat-x;
padding-top: 5px;
padding-bottom: 4px;
font-size:12px;
margin-right: 10px;
font-family: Monaco, sans-serif;
text-align: center;
height: 26px;
font-weight: bold;
color: #fff;
}
.headerjoin:hover {
background-image:url('/images/joinimageunder.png');
}
.headersignin
{
width: 64px;
float:right;
background-image:url('/images/signinimage.png');
background-repeat:repeat-x;
padding-top: 5px;
padding-bottom: 4px;
font-size:12px;
font-family: Monaco, sans-serif;
text-align: center;
height: 26px;
font-weight: bold;
color: #000;
}
.headersignin:hover {
background-image:url('/images/signinimageunder.png');
}