Bootstrap：当我对其应用 Bootstrap 样式时，Textarea 的高度缩小了答案

【问题标题】：Bootstrap: Textarea height shrinked when I apply Bootstrap style to itBootstrap：当我对其应用 Bootstrap 样式时，Textarea 的高度缩小了
【发布时间】：2015-04-05 09:14:17
【问题描述】：

我有一个 textarea，它的 height 属性在 CSS 中设置为 100%。它看起来像这样：

当我应用引导样式（向其添加“表单控制”类）时，我看起来像这样：

检查元素后。我发现引导程序将其高度值覆盖为“自动”。 CSS 看起来像这样：

textarea.form-control{
    height: auto;
}

但即使我将上面代码中的高度更改为

textarea.form-control {
    height:100%
}

它仍然看起来像这样：

请注意，与原始高度相比，高度仍然缩小了一点。

如何将其高度设置为原来的高度（如第一张图片）并仍然对其应用 Bootstrap 样式？

【问题讨论】：

标签： html css twitter-bootstrap textarea

【解决方案1】：

试试这个，希望对你有用。

textarea.form-control {
    height:100% !important;
}

【讨论】：

我只是将“！important”放在我原来的 CSS 类选择器中，它会覆盖 bootstrap 中的“auto”值。谢谢！

【解决方案2】：

要制作textarea 100%的高度，最好使用下面的 css 样式：

textarea.form-control {
    height: 100% !important;
}

这个样式会覆盖.form-control类bootstrap的样式。

希望对您有所帮助！

【讨论】：

【解决方案3】：

您可以在其父级上设置固定高度。

<div class="form-group" style="height:100px;">
  <textarea class="form-control"></textarea>
  <button class="btn">Create tweet</button>
</div>

【讨论】：

你的意思是，style="height:100px";