Bakgrund
Jag håller på att skapa ett röstningssystem där man kan rösta antingen positivt eller negativt. Tummen upp samt tummen ner är satta som bakgrunderna i två tomma div taggar, båda med bredden och höjden 16px.
[b]Problemet[b]
I Internet Explorer visas det helt rätt efter den bredden och höjden jag specificerat. I Firefox däremot så verkar de tomma <div> taggarna som håller i bilden trunkeras och visas inte alls.
Sätter jag display: block; på thumbup/thumbdown klasserna så blir det förvisso rätt och Firefox lyder den angivna bredden och höjden, men då blir de båda tummarna placerade på olika rader.
Någon som har en lösning för mig?
CSS
.thumbbox
{
width: 16px;
height: 16px;
padding: 0;
margin: 0;
display: inline;
}
a.thumbsup
{
background-image: url('images/sprites.gif');
background-position: 0 -16px;
background-repeat: no-repeat;
margin: 5px;
}
a.thumbsup:hover
{
background-image: url('images/sprites.gif');
background-position: -16px -16px;
background-repeat: no-repeat;
}
a.thumbsdown
{
background-image: url('images/sprites.gif');
background-position: 0 0;
background-repeat: no-repeat;
margin: 5px;
}
a.thumbsdown:hover
{
background-image: url('images/sprites.gif');
background-position: -16px 0;
background-repeat: no-repeat;
}
HTML
<div class="scorecontainer">
<div class="scorebox"></div>
<div class="votebox">
<div class="thumbbox"><a href="javascript: return false;" class="thumbsup thumbbox"></a></div>
<div class="thumbbox"><a href="javascript: return false;" class="thumbsdown thumbbox"></a></div>
</div>
</div>
PS. Vad är det med forumets CODE taggar? De verkar inte byta font i den innehållande texten. DS.
