View Full Version : Textarea max character width CSS

01-11-2010, 07:58 PM
Hi all,

I have a textarea in a form that is currently formatted with this....

.form_line textarea{
width: 200px;
height: 50px;
margin-top: 0px;
margin-left: 15px;
font-family: arial;
font-size: 10px;
font-weight: bold;
color: #606677;
text-decoration: none;
line-height: 1em;

...and this is the my html....

<div class="form_line"><label for="description">Description *</label><textarea name="description" type="textarea" id="description" cols="30" value=""></textarea>

What do I need to add to my style to restrict the textarea to a maximum number of characters before a new line is started. Currently when I type in the box it continues in one line and a horizontal scroll bar appears instead of wrapping onto the next line and creating a vertical scroll bar.

Thanks, Paul

01-11-2010, 08:21 PM
I don't think you can do it inside the textarea. Afaik it will only grab a string of characters. Javascript is an option but it sounds to me that a textarea is too much an integrated part of the browser. Lucky for you I'm often wrong.. ;) anyone?

01-11-2010, 10:16 PM
I just checked this in IE and it wraps okay on to the next line when the limit of 30 is reached. It carries on along the same line in Opera and Firefox.

Any ideas why this is and if there is a work around.


01-12-2010, 03:56 AM
I don't know that it will help but, if you got a width in your CSS, you don't really need the cols="30" in your html.

01-12-2010, 05:35 AM
The width is there to keep it the same as the other fields in the form. But I have removed the cols="30". It still only wraps to the next line in IE tho'.

01-12-2010, 06:35 AM
Actually, using your code in FireFox, the text wraps to another line with a vertical scrollbar for me.

Is your page online anywhere?

01-12-2010, 09:25 PM
Strange it worked for you DWcourse!

I have got it to work now. All I did was remove the type="textarea" from the code and it started to work in all browsers.