CODEWITHSUNDEEP
htmlcss
aray12
aray12

Reputation: 1843

How do I create a scrollable textbox?

Currently, the site has the following css class that is intended to be used for note (longer texts) entries in a form. 

.scrollabletextbox {
    height:100px;
    width:200px;
    font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
    font-size: 82%;
    overflow:scroll;
}

The size of the box and other styling register correctly, but the text start vertically centered and never line breaks. The only way to view the text completely is to move the cursor left/right.

The form uses the following html (with a little php) to implement the large text box

<input type="text" class="scrollabletextbox" name="note" value="<?php echo $note; ?>">

Thank you in advance for any help.

Upvotes: 12

Views: 84916

Answers (2)

Wilq
Wilq

Reputation: 2272

Try replacing input type="text" with textarea tag.

Change your code to:

<textarea class="scrollabletextbox" name="note">
  <?php echo $note; ?>
</textarea>

It sends data just as a normal input tag, so you can get data from it with the same methods.

Read more info about textarea tag

Upvotes: 13

Kevin Bowersox
Kevin Bowersox

Reputation: 94429

I would switch the control from an input to a textarea, which will perform the functionality you request by default.

<textarea class="scrollabletextbox" name="note"><?php echo $note; ?></textarea>

JSFIDDLE: http://jsfiddle.net/rJy94/

Upvotes: 7

Related Questions