CODEWITHSUNDEEP
javascriptjqueryhtmlcsssafari
Sastha
Sastha

Reputation: 131

In IOS hide input field blinking cursor for CSS

How to hide ios input field blinking cursor. am trying so many ways it's not working for me.

In Windows,

SCSS

.input--textfield {
    border: none;
    color: transparent;
    display: inline-block;
    font-size: 2em;
    text-shadow: 0 0 0 gray;
    
    &:focus {
        outline: none;
    }
}

HTML

<input type="text" name="" value="10" class="input--textfield">

Working for me,

IOS

Not working below code, do you have any suggestion.

Upvotes: 0

Views: 4242

Answers (2)

Pinbo Wei
Pinbo Wei

Reputation: 11

ios android

.input--textfield {
  border: none;
  color: transparent;
  caret-color: transparent;
  text-indent: -999em;
}
<input type="text" name="" value="10" class="input--textfield">

Upvotes: 1

Chandru M
Chandru M

Reputation: 61

Try below it's very simple and working for me in IOS (5s, 6), IOS desktop and windows.

.input--textfield { caret-color: transparent;
}
<input type="text" name="" value="10" class="input--textfield">

Upvotes: 6

Related Questions