Can CSS change the SRC attribute of an input element?

Question

Is it possible through CSS to remove or change the src link in the markup below?

It would be easy to change the markup, but this code is in the wild, and I need to deal with it as it is, so I am trying to delete the image and use the background image instead.

<input type="image" src="wp-content/uploads/image.png" name="submit" class="submit" value="Submit" /> 

Answer 1

You can experiment with setting the height and width to 0, add indentation and set the background image. You will need to do this display: block or display: inline-block for the height to take effect.

Here is an example - http://jsfiddle.net/zBgHd/1/

Answer 2

Actually, I just got it.

.submit {width: 0; height: 28px; background: url (go.png) no-repeat; padding-left: 28px;}

My replacement image is 28x28. By specifying a left fill equal to this and a width of zero, it effectively pushes the image out of the window's scope, leaving the background image to display.

Answer 3

Although this is especially true for the img src attribute, it is still saved for src input. This question is largely responsible for it - How do I change the image of an input button using CSS? Another related question: Define src <img> s attribute in CSS

Answer 4

No, to answer your question. Not in any version of any browser (AFAIK).

Any solution will be associated with a workaround. I am testing one right now when you use the :before rule to create a background image on top of it.

Updating ... Well, what does it cost :before not respected on input elements, whereas the @Chetan script works when I change the img tag to input . So prestige.