1st time using sprites. Help needed.

[nelliewilson]

Okay. Can't get this to work properly. The size of the image is 110px width by 110px height but I am unable to get the area to be that size. Setting the size by span tag hasn't worked and even inline didn't work either. What is the proper or suggested way of doing this?

Example:
My Site

CSS:

.sizer {
height:110px;
width:110px;
}

a.beta {
background:url(images/beta.png);
background-position: 0px 0px;
}

a.beta:hover{
background:url(images/beta.png);
background-position: -110px 0px;
}

a.beta:active{
background:url(images/beta.png);
background-position: -120px 0px;
}

HTML:

<span class="sizer"><a href="albuminfo.php" class="beta">area</a></span>

When using sprites one must use "dispaly:block;"

 

[ronaldroe]

Span tags are inline elements, and therefore only take up the space they need, nothing more. Try using display:inline-block; on the .sizer class