CSS3 :after pseudo element with input [duplicate]

Answer 1

An essentially identical question has been asked here that has a great explanation: https://stackoverflow.com/a/4660434/749227

To summarize, inputs are not containers and cannot have children. The content inserted by the :before and :after pseudo-elements normally can't therefore be inserted into inputs.

Note that rather than using you can use which can have children, so for that input there's a 'workaround' (well, if you have control over the markup ;)