如何在Bootstrap 3中將Textarea設置爲100％的高度？

我想將textarea設置爲100％高度。我正在使用Bootstrap 3，但在那裏找不到選項。如何在Bootstrap 3中將Textarea設置爲100％的高度？

<div class="container"> 
<textarea class="form-control" rows="8"></textarea> 
</div>

怎麼辦？

來源

2014-01-21 Jay

爲什麼不使用'height：100％'？ – Zhihao

@Zhaohao因爲它不這樣工作，使用boostrap和所有預定義的默認設置。 – davidkonrad

html, body, .container { 
    height: 100%; 
} 
textarea.form-control { 
    height: 100%; 
}

見demo on Fiddle

來源

2014-01-21 15:12:56 davidkonrad

textarea { 
    min-height: 100%; 
}

來源

2014-01-21 15:10:02 CRABOLO

你試過了嗎？它不起作用。這是** bootstrap **問題。 – davidkonrad

您可以使用CSS：

textarea { 
    height: 100%; 
}

相對於頂層。

來源

2014-01-21 15:11:05 skozz

你試過了嗎？它不起作用。這是** bootstrap **問題。 – davidkonrad

是的，但沒有'block'。我的錯。看到jsfiddle，我告訴過你，你需要考慮之前的主要容器，像'davidkonrad' – skozz

我相信這是一個引導的問題。我遇到了類似的問題，textarea不允許超過1行。我發現（通過試驗和錯誤）將textarea放在div中，然後忽略第一個div中的form-group-（x）調用，我可以控制textarea中的行和列。

<div class="form-group"> 
    <label class="col-sm-3 control-label">Description</label> 
    <div class="col-sm-9"> 
     <textarea class="form-control" rows="10"></textarea> 
    </div> 
</div>

更改你的代碼使用表單組功能將更正此問題：

<div class="form-group"> 
    <textarea class="form-control" rows="8"></textarea> 
</div>

這應該爲你做的伎倆。

來源

2014-10-15 16:25:59 Javamav

是的，它幫助了我。謝謝。 – user1501382

這對我有用。我也使用Bootstrap 3。我的textarea在一個容器內。

textarea { 
    width: 100%; 
    height: 100%; 
    position: absolute; 
    top: 0; 
    left: 0; 
    right: 0; 
    bottom: 0; 
}

來源

2014-10-31 01:51:09 theawesomecoder61

不爲我工作的引導3- davidkonrad 你可以嘗試修改行

<textarea class="form-control" cols="60" rows="16"></textarea>

的數量或給定的父容器

.form-group{ 
    height:250px; 
} 
textarea{ 
    height:100%; 
}

來源

2015-04-26 08:45:18 Xam1311

''This is working。 –

高度

這解決了我的問題..我將高度設置爲auto！important。

<label for="item_description" style="padding-top: 10px;">Item Description</label> 
<textarea class="form-control" name="item_description" rows="3" style="height:auto !important;"></textarea>

來源

2017-07-21 07:02:59

如何在Bootstrap 3中將Textarea設置爲100％的高度？

回答

相關問題