a.dismiss-cross {
background: transparent url(/images/cross-grey.png) no-repeat scroll 0 0;
float: right;
border: none;
width: 19px;
height: 19px;
display: block;
}
a.dismiss-cross:hover {
background-position: 0 -19px;
}
And implemented with
<a class='dismiss-cross' href='#'></a>
Lo and behold it doesn't work in IE whereas its fine in every other browser.
Any ideas?
Thanks.
Best Answer
I'm not really sure, but as far as I remember you have to explicitely declare the
:link
and:visited
pseudo-classes:And, by the way, if you use floating, there's no reason on assigning a block display. Floating implies block display. But... IE6 has a bug with floated elements that have margins. It doubles the margins. The fix is quite simple though. You set
display: inline;
. This is ignored by all the other browsers, but fixes IE6.