问题描述:

I see that whenever there is more text than the size of the text field, start of the text gets shown when not on focus. In the picture below, i want to show the end of the text like 1, but when text field is not in focus automatically start of the text is shown. I tried right align (bootstrap text-right) as shown in 3 but that didn't help

Code chunk related to this:

 <div class="form-group">

<label for="" class="control-label col-xs-3">Work Space:</label>

<div class="col-xs-6">

<input type="text" class="form-control text-right" id="workspace" placeholder="">

</div>

<div class="col-xs-2">

<button type="button" id="load_files" class="btn btn-info">Load Files</button>

</div>

</div>

Edit:

Just tried this in Mozilla firefox, it works just as i want it to, but doesn't work in chrome

网友答案:

Set the direction CSS property to match the direction of the text you want. rtl or ltr.

input {
  direction: rtl;
}
input:focus,
input:active {
  direction: ltr;
}

Here's a fiddle demo for you to review. http://jsfiddle.net/yongchuc/on91y1hr/

相关阅读:
Top