html - 列不会设置在文本区域中

Question

这太神秘了。我有一个带有 textarea 字段的表单。我已经删除了装饰器和所有这些，并且我使用行和列来 setAttribs(在 Zend Framework 中开发)。 textarea 仍然非常宽，溢出其容器并超出视口(viewport)。如有必要，我可以添加屏幕截图。

基本代码如下:

<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>

这是奇怪的地方。

1. 如果我更改行值，行也会更改。如果我更改 cols 值，则不会发生任何变化。但是行确实发生了变化，所以我知道语法是正确的，而且我还是与其他开发人员进行了交叉核对。他们也不知道发生了什么。
2. 如果我复制代码并将其粘贴到一个简单的 html 页面中，textarea 大小正确

我查看了 CSS(这应该无关紧要，但我检查过)并且没有对 cols 的引用，唯一的宽度引用是对其他元素的引用。简而言之，cols 设置的行为方式绝对没有任何原因。

然而，它是。

Answer 1

设置width: auto后，cols属性对我有效(至少在Chrome中，我还没有测试其他浏览器)。

textarea {
  width: auto; 
}