I am trying to use :after CSS pseudo element on INPUT field, but it does not work. If I use it with SPAN, it works OK.

<style type="text/css">
.mystyle:after {content:url(smiley.gif);}
.mystyle {color:red;}
</style>

This works (puts the smily after "buu!" and berfore "some more")

<span class="mystyle">buuu!</span>a some more

This does not work - it only color someValue in red, but there is no smiley.

<input class="mystyle" type="text" value="someValue">

What am I doing wrong? should I use another pseudo selector. Note: I can not add SPAN sround my INPUT; because it is being generated by a third party control.

Matraj