javascript - How can I indent the text, and starting position of cursor, in a TextBox (user, password, etc..) - Stack Overflow

I have a login form, with username and password input fields.

These boxes have shadows, and when you click the box, the cursor blinks in the shadow and you can barely see it.

I want someone to click in the text box and have the cursor blink at a 3px indent from the left of the text box. How do I do this? Thanks!

I have a login form, with username and password input fields.

These boxes have shadows, and when you click the box, the cursor blinks in the shadow and you can barely see it.

I want someone to click in the text box and have the cursor blink at a 3px indent from the left of the text box. How do I do this? Thanks!

• javascript
• html
• css

Share Improve this question Follow edited Jun 9, 2012 at 16:59 Mike B 32.1k1313 gold badges8989 silver badges113113 bronze badges asked Jun 9, 2012 at 16:56 EddieEddie 17944 silver badges1414 bronze badges 0

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 3

Does your input have a class on the css file? If yes, you should add the element padding-left: 3px; to that class.

If not, you should add style="padding-left: 3px;" to the input tag in your html.

You can add padding-left: 3px; to the input box's style. Keep in mind that if you want the input box width to stay the same, you'll want to subtract 3px from its width as well.

Add this to your textboxes:

style="padding-left: 3px"

Or this:

style="text-indent: 3px"

Using a padding would be the best way. style="padding-left: 3px;"

You can do this using the text-indent css property.

<input style="text-indent:16px"/>