Jump to content
Larry Ullman's Book Forums

Text Area Sizes


Recommended Posts

No matter what I do the length of my text area does not change. I can change the depth. I am testing my site on three different browsers and it comes out with either a scroll bar or a tab that the user can pull to a different length. I would like a set box so that the user can see what they type and know how much space they have to use. My text areas are about 1-1/2" wide and I would like it to be 4" wide. I do not see any CSS that would be overriding it.

 

This is the code from the Knowledge is Power web site in the forms_function.inc.php. I have changed the depth to 2 columns. I have tried several different configurations of code but it does not change.

 

// Start creating the textarea:

echo '<textarea name="' . $name . '" id="' . $name . '" rows="2" cols="150"';

 

Thank you,

 

Marie

Link to comment
Share on other sites

The moveable regions of the text area are often due to the browsers. The best way in my opinion is to use css give the textarea an id and reference the height and width in the css

 

form #textAreaIdName {

height: 400px;

width: 600px;

}

 

I also suggest the firefrox web developer toolbar that is extremely useful for working with css inside the browser and editing it rather than having to go back and update files with rules that may not work.

  • Upvote 1
Link to comment
Share on other sites

Hello,

 

Thanks for your suggestion. I thought that I had tried to do something with CSS before and it didn't work. However, your suggestion did change the size of the text area but also changed all the other form fields which are now too big. So I will have to do some tweaking but at least I can see that CSS can override the forms function file. CSS is very powerful.

Link to comment
Share on other sites

Since you are dynamically setting the id in PHP, you'll probably have to use a class selector in your CSS and set a class attribute on the text area, instead of using an id selector:

 

.textArea600x400 {
width: 600px;
height: 400px;
}

 

Then add class="textArea600x400" as an attribute of the text area you want to size.

  • Upvote 1
Link to comment
Share on other sites

 Share

×
×
  • Create New...