input are both replaced elements.
A replaced element is any element whose appearance and dimensions are defined by an external resource. Examples include images (
<img>tags), plugins (
<object>tags), and form elements (
<select>tags). All other elements types can be referred to as non-replaced elements.
:after only work with non-replaced elements.
From the spec:
Note. This specification does not fully define the interaction of
:afterwith replaced elements (such as IMG in HTML). This will be defined in more detail in a future specification.
span:before, span:after, the DOM looks like this:
<span><before></before>Content of span<after></after></span>
Evidently, that won't work with
<img src="" />.