How can I use the first letter of input?

I'm currently trying to extract the very first letter from the input.

Here is what I tried:

fieldset input { text-transform:capitalize; } 

But this does not work the way I want, since every word is capitalized.

I also tried this:

 fieldset input:first-letter { text-transform:uppercase; } 

But this seems <input /> doesn't work at all with the first letter ...

Anyway, do you have any ideas on how to achieve this without javascript (or as little as possible)?

+7
css
source share
4 answers

JS : str.charAt(0).toUpperCase();

+6
source share

impossible. This is possible using Javascript, or by placing only the first word within a range .

+2
source share
 $('#INPUT_ID').keyup(function(){ if($(this).val().length>0 && $(this).val().length<5){ $(this).val($(this).val().charAt(0).toUpperCase()+$(this).val().substr(1)); } }); 

You cannot use length == 1, since it does not work if the user quickly picks up speed.

0
source share

You have to use

 <fieldset> <legend>DATA...</legend> <input type="text" class="inputName" placeholder=" "> 

without <input />

then in CSS:

 fieldset input { text-transform: capitalize; } 
0
source share

All Articles