Possible to disable submit button press down effect?

HTML & CSS
1

Hey all, is it possible to disable the press effect of a submit button? I made the button a complex graphic (which is why I don’t use type=“image”) and in IE it still maintains that “press” effect; is there any way to disable this?

Thanks,
Darren

2

what do you mean by press effect?

if you are talking about the glow or highlight ( you may need to clear the effect by using
#yourDuttonID:active{…}

if you jsut dont want the form to automatically submit when the button is pressed, use onSubmit=“return false” on the FORM tag

hope that helps

3

can you post a URL to the page in question?

4

Why not use input type=“submit” with a background image and move the text off screen instead of <button> which I’m assuming you’re using now?


.submit {
  border: 0;
  background: url(/path/to/my/image.jpg) no-repeat;
  width: width-of-my-image px;
  height: width-of-my-image px;
  text-indent: -999em;
  text-transform: capitalize; /* IE7 fix */
}

That way people without CSS will just see the text in the button, and screen readers will read it as well if I’m not mistaken.

5

the text-indent with negative values will read correctly through a screen reader.

I believe there are issues in IE with the button tag but does that make a difference over using input?

6

Hi all, it needs to be text because it uses multi-language capabilities. I guess I will just live with the button press effect.

7

I’m still not really sure what you’re after, and seeing from the replies of others I’m afraid none of us are…

8

haha. I think we’re all confused.

You can use a background image for the button using type=“submit” you can then overlay text, whether it’s script to convert to other languages or not.

The text-indent won’t work because the -999 moves it completely off screen.

I think the easiest thing would be for you to post a URL to your page so we can take a look

9

Do you mean something like this?

http://www.pmob.co.uk/temp/input-rollover-test.htm