How To Set Cursor Position To The Top-left Edge Of Input

Let I've an input field like the following: How can I set cursor postition to the top-left edge of this input field?

Solution 1:

This should work

input {
   padding-top: 0;
   padding-left: 0;
   line-height: 1em; // this probably doesn't matter
}

It seems that you likely have padding of like 40px 0 or something. So the top and bottom has a lot of space (padding) on the top and bottom.

EDIT:

If that didn't work, you likely have a height set for your input, which is bad. Since an input is intended to only be one line. If you want multiple lines you are to use <textarea></textarea> tags instead of <input>

If you don't want to use <textarea> but have a bigger height for some reason, remove the height from your input and just use padding like this

http://jsfiddle.net/PVRp4/

input {
    padding: 00400px0;
}

Solution 2:

Textarea or big size text input ? Input is for single line element use <textarea></textarea>. Code pls ... Remove all whitespace between <textarea></textarea> or <input></input>tags.

Or in your css code you have text-align: center to your parent elements, or somewhere else but its still formating your input. Press f12 in the browser and check the element.

Solution 3:

AFAIR there is no option the place the cursor inside of an input field, except left, center, or right. Vertical Alignment isn't possible.

Solution 4:

Simple solution for me was within the HTML code for my ASP:TextBox was at the end of my tagline put "...TextMode="MultiLine" /> as below:

<asp:TextBoxID="txtPermissionSearch"runat="server"Width="150px"Height ="150px"TextMode="MultiLine" />