How to set character width of text input control and mask inputs?

[davout]

I’m trying to set the width of a text input control, like…

<smart-input id="userId" placeholder="User Id" size="30" style="margin-right: 15px"></smart-input>
<smart-input id="password" placeholder="Password" size="12" style="margin-right: 15px"></smart-input>
... and 'size' is not working.  Any suggestions?
Also, how do mask the input values of the 'password' input so that they are displayed as '****@ ?

 

[hristojqwidgets]

Hello davout,
If you want to change the size of the font then you should use the approach below:

#password {
--smart-font-size: 20px;
}

More details you could find in the page below:
https://www.htmlelements.com/docs/input-css/
About the case with the password, I would like to suggest you use the Smart.PasswordTextBox.
Please, take a look at this demo:
https://www.htmlelements.com/demos/passwordtextbox/basic/
Best Regards,
Hristo Hristov
jQWidgets team
https://www.jqwidgets.com

[davout]

No…. not the size of the font.
Size for the number of characters visible in the input control.   I want the text input box to be able to show 30 characters without scrolling

[hristojqwidgets]

Hello davout,
There is no “size” property.
You could only set different size with the width member.
Please let me know if you have any other questions.
Thank you for your understanding.
Best Regards,
Hristo Hristov
jQWidgets team
https://www.jqwidgets.com

[Author]

Posts