Columns won't set in a textarea

Question

This is miserably mysterious. I have a form with a textarea field. I've removed decorators and all that, and I setAttribs with rows and cols (developing in Zend Framework). The textarea continues to be extremely wide, spilling out of its container and outside the viewport. I can add a screenshot if necessary.

Here's the basic code:

<form id="edit-pending-email" enctype="application/x-www-form-urlencoded" method="post" action="[path]/email/edit-pending-email/">

<label for="salutation" class="optional">Salutation</label>

<input type="text" name="salutation" id="salutation" value="Yo" /> <p><label for="content" class="optional">Body of Email</label>

<textarea name="content" id="content" cols="40" rows="30"> blah blah ... text goes here ...

</textarea></p>

<input type="submit" name="save" id="save" value="Save" />

<input type="submit" name="cancel" id="cancel" value="Cancel" /></form>

Here are the oddities.

1. If I change the rows value, the rows change. If I change the cols value, nothing changes. But the rows do change, so I know the syntax is correct, and anyway I crossed checked with other developers. They don't know what's going on either.
2. If I copy the code and paste it into a simple html page, the textarea sizes correctly

I have looked in the CSS (it shouldn't matter, but I checked) and there's no reference to cols and the only width references are to other elements. In short, there is absolutely no reason why the cols setting is behaving the way it is.

And yet, it is.

Answer 1

After setting width: auto, the cols attribute works for me (at least in Chrome, I didn't test other browsers yet).

textarea {
  width: auto; 
}

Answer 2

I finally tracked this one down. It was indeed in the stylesheet. That is, it wasn't in the stylesheet, but should have been.

Turns out, for reasons I do not understand, a textarea (applies to other elements too) wants to expand to its maximum, regardless of what cols says. This makes no sense to me but there it is.

The way to fix this is to set max-width. As soon as I did that, the element behaved and sized to the proper width. Note: width doesn't do it. Only max-width works.

Geez.