CSS 忽略文本区域高度

Question

我有以下 HTML 代码：

<textarea type="text" class="dlk_q" rows="2" cols="98%" name="q[]">

在具有其他样式表的页面中，但我在 HTML 中的文本区域之前添加了这个 CSS:

textarea, .dlk_q {
    width: 98%;
    height: 50px !important;
}

然而textarea的高度似乎比50大很多（即高度被忽略）我该怎么办？

Answer 1

选项 height 如果还有 min-height 具有更大的价值，则将被忽略，因为这是为它设计的。

文档：https://www.w3schools.com/cssref/pr_dim_min-height.asp

根据您在评论中提供的演示，您在 CSS 中有此块：

textarea {
  font-size: 12px;
  line-height: 21px;
  color: #444;
  border: 1px solid #e1e1e1;
  width: 100%;
  max-width: 100%;
  height: 168px;
  min-height: 168px; // HERE
  padding: 6px 9px;
}

如您所见，有 min-height: 168px;。

您所要做的就是删除它，或者如果由于某种原因您不能这样做，则覆盖它。

textarea, .dlk_q {
  width: 98%;
  height: 50px !important;
  min-height: 0 !important; // ADD THIS
}

Answer 2

因为有 min-heigth 设置，所以我将其重新设置为：

textarea {
    min-height:initial; /* resets the value set by theme */
}

CSS 忽略文本区域高度

Textarea Height being ignored by CSS

html

css

textarea