<input type="number"></input>. I like the fact that it has
type="number" since I want numeric input from the user. I would rather not change its type away from number. However, I would like to display the units after the number. So I want the input to read "5 px" if the unit is in pixels. I want the user to be able to edit the 5 part, but not the px part. The solution found here will not work unless I do more gimmicks and make it hackier, because the "px" would come after the up/down arrows in chrome. These are the arrows I'm talking about![example of arrows]
On my environment in chrome, you can just put alphabetical characters in the
<input ...>, but this is technically not legal
I need a solution that works on firefox, chrome, safari, and IE9.