fun
fun

Reputation: 13

Making a scroll-able text field in html?

What i'm getting

Is it anyhow possible that I can view all the contents of the text input here? All these values are coming from database.

I used style="overflow-x:auto" but it didn't change anything.

Upvotes: 1

Views: 38

Answers (1)

K K
K K

Reputation: 18099

Try wrapping the inputs in a container and limit it's width and then use overflow property on the container instead of the inputs:

div {
  width: 100px;/*for example only*/
  overflow: auto;
  white-space: nowrap;/*for example only*/
  padding: 10px;/*for example only*/
}

html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
  width: 100%;
}
<div>
  <input type="text" value="687sjkfkjahfkgjahskjdghaskhkjhasdkjghasjkhgkjsadhgkjsdkjfhskdhfkjsa">
</div>
<div>
  <input type="text" value="687sjkfkjahfkgjahskjdghaskhkjhasdkjghasjkhgkjsadhgkjsdkjfhskdhfkjsa">
</div>
<div>
  <input type="text" value="687sjkfkjahfkgjahskjdghaskhkjhasdkjghasjkhgkjsadhgkjsdkjfhskdhfkjsa">
</div>
<div>
  <input type="text" value="687sjkfkjahfkgjahskjdghaskhkjhasdkjghasjkhgkjsadhgkjsdkjfhskdhfkjsa">
</div>
<div>
  <input type="text" value="687sjkfkjahfkgjahskjdghaskhkjhasdkjghasjkhgkjsadhgkjsdkjfhskdhfkjsa">
</div>

Upvotes: 1

Related Questions