css ::after not applying to input

Question

I wnats to apply after in input tag but fails to dot that do anyone knows how to resolve the issue here is the code https://code.sololearn.com/Wyp66sQPerDI/?ref=app

Answer 1

They aren’t supported for <input> elements.
Look at the second paragraph of the first answer: https://stackoverflow.com/questions/2587669/can-i-use-a-before-or-after-pseudo-element-on-an-input-field

Answer 2

Hi Abdul Azeez , the after and before pseudo elements manipulates after /before the CONTENT INSIDE THE TAG, for example - if we use
div ::after{ content:"hi"; }
on a div element, it adds the "hi" after the CONTENT of the div element (before the ending div tag).
Hence we can't use ::after with input tags since they don't have an ending tag.