Javascript 如何在不修改div的情况下增加textarea的宽度？

在以下情况下，如何使用纯CSS调整textarea的大小，而不损坏表的整个结构：

标题：

<div class="pure-u-1 pure-u-md-1-8">
<label class="boldText">Nmbr</label>
</div>
<div class="pure-u-1 pure-u-md-2-5">
<label class="boldText">ques</label>
</div>
<div class="pure-u-1 pure-u-md-1-5">
</div>
<div class="pure-u-1 pure-u-md-1-5">
<label class="boldText">comments</label>
</div>

Nmbr
问题
评论

第1行：

<div class="pure-u-1 pure-u-md-1-8">
<label class="boldText">Nmbr</label>
</div>
<div class="pure-u-1 pure-u-md-2-5">
<label class="boldText">ques</label>
</div>
<div class="pure-u-1 pure-u-md-1-5">
</div>
<div class="pure-u-1 pure-u-md-1-5">
<label class="boldText">comments</label>
</div>

布拉布拉

<div class="pure-u-1 pure-u-md-2-5">
One more Bla
</div>
<div class="pure-u-1 pure-u-md-1-5">
One More Bla
</div>
<div class="pure-u-1 pure-u-md-1-5">
<textarea class="normal" style="height: 75px; width:300px; overflow: hidden; word-wrap: break-word; resize: horizontal;" name="commento" id="commento"></textarea>
</div>

再来一杯
再来一杯

问题是Textarea仍然是使用“pure-u-md-1-5div”类应用的宽度

当我尝试增加宽度时，比如style=“width:400px”，它不会增加textarea的宽度

若我试图增加其div的宽度，那个么文本区域将跳到下一行。若我通过将像素从400px减少到490或495来进行调整，那个么当我尝试缩放页面时，文本区域也会移动到下一行

---

如何通过不修改div来增加textarea的宽度

应用样式

位置：绝对；排名：0；左：0

将

pure-u-

类添加到文本区域。要使用列的全宽，如下所示：

<textarea class="normal pure-u-1" style="height: 75px; overflow: hidden; word-wrap: break-word; resize: horizontal;" name="commento" id="commento"></textarea>

---

或者，如果您想在右边留一点边距，您可以使用

class=“normal pure-u-23-24”

如果我理解正确，您可以尝试不使用div，而只是使用类显示文本区域：

<div class="pure-u-1 pure-u-md-2-5">
One more Bla
</div>
<div class="pure-u-1 pure-u-md-1-5">
One More Bla
</div>
<textarea  class="pure-u-1 pure-u-md-1-5" style="word-wrap: break-word; resize: horizontal;" name="commento" id="commento"></textarea>

再来一杯
再来一杯

---

但是我得到的印象是，您希望能够动态调整文本区域的大小，使其大于pure-u-md-1-5 size所允许的大小。在这种情况下，你最好使用一个弹出窗口或类似的东西，只需点击一个按钮就可以打开它并编辑文本区域

您是否尝试增加“cols”属性？对它不工作它需要文本区域到屏幕的最左边。但就像在代码中一样。文本框在第四行。事实并非如此work@fatherazrael您必须至少有一个样式为

position:relative的父容器div{position:relative；}