如何在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％的高度？

回答

相关问题