[CSS] Unchangeable input image border in FF/CH/SAF/IE8?

views:

answers:

+3 Q:

[CSS] Unchangeable input image border in FF/CH/SAF/IE8?

Guys, I've found a very strange thing.

I was complaining about it before, but nobody sees old questions here.

Here's an example:

It works perfectly in Opera only... In Firefox, Chorme, Safari and IE8 there's a border around this button... And I have no idea WHY? How to delete the border?

Thanks.

+2 A:

Thats because you have set a type of image and not defined an image url... you have set the background image using CSS.

Change your element to a span or such and this will fix the issue, also add cursor to be a pointer in css too, this will give the user the idea to click it. then use an onclick event for the submit.

JamesStuddart 2010-09-14 16:23:34

Further to this, if you change the `type="image"` to `submit` or `reset` the border disappears. Also, would the `<button>` element be more appropriate, and more easily style-able.

David Thomas 2010-09-14 16:28:10

incorrect, defining background images for elements should be done in CSS, the only time you should use image tags is to show external images, this is the way search engines discover images for the image search.

RobertPitt 2010-09-14 16:28:42

Your comment is completely off topic? an image has been define with NO actual image url therefore the browsers are complaining there is a missing image. background images should be defined with CSS yes! but that is not what is being discussed here...

JamesStuddart 2010-09-15 08:05:31

As others have noted, you have defined an "image"-style button but not provided a source URL, resulting in a broken image.

The simplest solution is to change type="image" to type="button", which removes the broken image icon and border.

Ben Blank 2010-09-14 16:31:02

ansaurus

tags:

views:

answers:

[CSS] Unchangeable input image border in FF/CH/SAF/IE8?

related questions