I can't decide which of the following 3 options is best so I'll ask here which option would you choose and why?
Edit: to be clear those are text input controls and not cells of table data.
Try them out here -- http://codepen.io/run-time/pen/LEGqqJ
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.Sign up to join this community
This is more a matter of taste & design than usability. Both 1 and 2 indicate that there is some text hidden. Option 3 doesn't always do that, it just depends on the length of the field and the input. So in terms of usability, I'd scratch that one if I were you.
Now, comparing red pill vs blue pill. With the red pill you can still see (and select) the entire text. You can't do that with the blue one (well you could, but it'd be more work).
In the end, it all comes down to:
My recommendation: Don't go down the rabbit hole... On a more serious note, I'd take the red pill.
Take the red pill! It shows that there is more content without cutting of the data in a hard-edge sort of matter. If the rest of your UI is more of a 'metro' design, use the third option.
I seem to disagree - don't use the third option. If things turn against this design, there is no indication that there might be more text (i.e., when a word nicely ends at the right side - in your case, when the field would have been 5 pixels more narrow).
The Red Pill is more innovative (which might or might not fit with your design and target group and browser population), while the Blue Pill is more conventional (which will be the safe choice). Choose which fits best into your design, I'd say.