Remove blinking cursor

Description

I had the problem, that I have an input with a number and two triggers to increase and decrease the number. Now you click on the input, then you get the blinking cursor.

Solution

HTML

<input type="number" name="" value="10" class="input--numberfield">

SCSS

.input--numberfield {
    border: none;
    color: transparent;
    text-shadow: 0 0 0 gray;
    text-align: center;

    &:focus {
        outline: none;
    }
}

Use text-shadow to give your number the color ;)

Demo

http://jsfiddle.net/KvdkV/