无法将两个元素设置在同一水平

Question

https://jsfiddle.net/xtm5oqjh/ 打开导航栏上的模态（“ +”号）时，您会看到“保存更改”按钮和“优先级”下拉列表的高度不同，并且在水平方向上也不相同。

之后：

.input-group {
    height: 31px;
    padding-bottom: 0;
    margin-bottom: 0;
}

它的确与“保存更改”按钮具有相同的高度，但由于边缘仍在水平位置，因此它在水平方向上仍未处于同一水平。我对为什么会这样感到困惑。有任何线索吗？

Answer 1

此元素：

<div class="input-group mb-3 w-50">
  ...
</div>

类mb-3在该元素组的底部添加了margin-bottom，将其推到比您尝试与其对齐的“保存更改”按钮更高的位置。删除该课程，您应该没问题。