开发者

Button image moves up slightly when being clicked (in Internet Explorer)

Does anybody know why an image may move/jerk slightly w开发者_如何学Gohile being clicked (only happens in IE)? This is our button:

<button class="join" name="register" value="" onClick="window.location = 'location'" tabindex="4"></button>

This is the class:

button.join {
        background: url(../images/join.png);
        border: 0;
        height:  56px;
        width: 178px;
        cursor: pointer;
        }


Button tags are always a hassle to get styled correctly cross-browser. As long as you're using javascript for the onClick there's no real reason to use the button tag. Try using an anchor tag, targeting all states and setting the position of the image.

<a class="join" href="#" id="register" onClick="window.location = 'location'" tabindex="4">Button</a>

a.join:link,
a.join:visited
a.join:hover,
a.join:active
{
        background: url(../images/join.png) 0 0 no-repeat;
        border: 0;
        text-indent: -999em; /* Optional - To remove the HTML text from the button */
        height:  56px;
        width: 178px;
        cursor: pointer;
}
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜