react react-bootstrap 按钮无法设置自定义高度。只能用css设置宽度

Question

我一直被这个问题困扰，并没有找到一种方法来调整带有 css 样式的 react-bootstrap 按钮的高度。我可以设置宽度。这是我的以下代码

JSX

内部渲染和返回代码

<div className="row">
  <Button className="btn-danger btn-edit btn btn-default">Button 1</Button>
<Button className="btn-danger btn-edit btn btn-default">Button 2</Button>
<Button className="btn-info btn-edit btn btn-default">Button 3</Button>
<Button className="btn-success btn-edit btn btn-default">Button 4</Button>
<Button className="btn-primary btn-edit btn btn-default">Button 5</Button>
</div>

in my style code, I added a class for each to add custom height and weight

.btn-danger {
  width: 25% !important
  height: 20% !important
}
.btn-success {
  width: 25% !important
  height: 20% !important
}
.btn-primary {
  width: 25% !important
  height: 20% !important
}
.btn-info {
  width: 25% !important
  height: 20% !important
}
.btn-success {
  width: 25% !important
  height: 20% !important
}

我按 F12 来检查按钮并为 btn、btn-danger 等添加/调整高度......高度根本没有改变。

在尝试这些步骤时，我不知道接下来要尝试什么。我想如果自定义类允许我改变宽度，它也会让我改变高度。

感谢任何帮助，谢谢

Answer 1

找到了解决方案。在 css 中将高度更改为最小高度。