Input Element - Align Content that Overflows Left on Blur-CodePudding

If you have a text input of a certain length and you set the content in it longer than the area, how can you have the content always align left in the text box on blur? Even if you manually go to the cell, scroll to the right side and then leave.

<input type="text" style="width:100px" value="356 Must Read Number Ave New York, NY">

You should always be able to read "365 Must ..." in the beginning of the input? text-align:left; doesn't seem to work.

CodePudding user response：

let el = document.querySelector("input") 
el.addEventListener("focusout",function (e) {
    el.scroll(0,0)  //first one x-coord, second one y-coord
})

Element.scroll() might be helpful