javascript - How to apply Title Case in input box through css

Question

I am using text-transform property to convert inputbox text into Title Case, But I am not getting the exact property or combination to do this.

I also tried

text-transform: capitalize;
text-transform: lowercase;

I am trying to auto conversion for these

nIklesh raut : Niklesh Raut

NIKLESH RAUT : Niklesh Raut

Or should I go with Javascript.

Answer 1

You can do like following way using css. This will work for all word.

input { 
  text-transform: capitalize;
}
::-webkit-input-placeholder { 
    text-transform: none;
}
:-moz-placeholder { 
    text-transform: none;
}
::-moz-placeholder { 
    text-transform: none;
}
:-ms-input-placeholder { 
    text-transform: none;
}

<input type="text" placeholder="test" />