Hi
I have a link with an image as background which should turn green when
user click on the link (:active). Works good in Frirefox and Webkit
and IE8, but not in IE7: The button remains green (active) when user
releases the button, and turns back to regular state when button loses
focus.
Here is the HTML:
<a id="formSubmit" class="button" href="#">
<span>Login</span>
</a>
And here the CSS:
a.button, a.button:visited, a.button:hover, a.button:focus,
span.buttonDisabled {
background: transparent url('../img/button_right.gif') no-repeat
scroll top right;
display: block;
float: left;
height: 22px;
margin-right: 6px;
padding-right: 11px;
text-decoration: none;
}
a.button:active {
background: transparent url('../img/button_right_pressed.gif')
no-repeat scroll top right;
}
a.button span, a.button:visited span, a.button:hover span,
a.button:focus span, span.buttonDisabled span {
background: transparent url('../img/button_left.gif') no-repeat;
display: block;
line-height: 14px;
padding: 4px 0 5px 11px;
font-size: 10px;
font-family: Verdana, Geneva, sans-serif;
text-transform: uppercase;
color: #000;
font-weight: bold;
}
a.button:active span {
background: transparent url('../img/button_left_pressed.gif') no-repeat;
}
Sorry I have no public link for the site.
Thanks in advance for any hint!
Peter
______________________________________________________________________
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
