I am working on a web page that is going to be used in hybrid mobile application and I have to take care for screen reading users as well in terms of content accessibility. There is input for telephone number of user as follow:
<input required type="tel" name="phonenumber" id="phonenumber"
aria-label="put in your mobile number with at least 7 digits"
placeholder="91234567" class="form_control flg_phone_numb">
Everything is fine but when user has entered some value in here. and go to some other input.After that, when user focuses on telephone input, it speaks input in million like currency count. Is there any way that I could force it to speak one number individualy. I tried following css but it did not work.
speak:spell-out ;
speak:digits;
I found out that this is related to operating system .Like in ios and android behavior screen reading is supposed to do so. I checked facebook and instagram as a reference.