如何在不修改div的情況下增加textarea的寬度？

如何調整textarea的使用純CSS下列情況下，不損壞表的整體結構：如何在不修改div的情況下增加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>

ROW1：

喇嘛喇嘛

<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-5 div」類應用的寬度。

當我嘗試增加寬度，如style =「width：400px」，它不會增加textarea的寬度。

如果我嘗試增加其div的寬度，那麼文本區域跳轉到下一行。如果我通過像像素從400px減小到490或495那樣進行調整，那麼當我嘗試縮放頁面時，文本區域會切換到下一行。

如何通過不修改div來增加textarea的寬度？

來源

2015-05-05 fatherazrael

您是否嘗試增加'cols'屬性？ http://www.w3schools.com/tags/att_textarea_cols.asp –

是的。它不起作用 – fatherazrael

應用樣式position:absolute;top:0;left:0;

來源

2015-05-05 11:14:34

它需要textarea留下大部分屏幕。但在代碼中。文本框在第四行。它不起作用 – fatherazrael

@fatherazrael你必須至少有一個父級容器，樣式爲'position：relative;'，例如使用'div {position：relative;}; –

添加pure-u-類textarea的。要使用列的全寬度會是這樣：

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

來源

2015-06-16 05:43:38 stickyuser

如果我理解正確的，你可以嘗試不使用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>

但是我得到你希望能夠動態地調整文本面積大於尺寸的印象純-U-MD-1-5尺寸允許：，只是使用的類顯示的textarea 。在這種情況下，您最好使用彈出窗口或類似的東西，只需放一個按鈕，您可以點擊打開它並編輯文本區域？

來源

2015-12-03 16:10:10 Mike

如何在不修改div的情況下增加textarea的寬度？

回答

相關問題