Html 带双线标签的Bootstrap 3水平表格

当标签有两行时，如何垂直对齐标签和输入

这是我的密码：

<form class="form-horizontal">
  <div class="form-group">
    <label class="control-label col-sm-3" for="passwd_confirm">Confirmation du mot de passe:</label>
    <div class="col-sm-9">
      <input type="password" class="form-control" id="passwd_confirm" maxlength="32">
    </div>
  </div>
<form>

通行证确认书：

默认显示为输入和标签的第一行具有相同的基线，但我希望将输入与标签的垂直中心对齐

我该怎么做

---

谢谢。

如果您使用的是bootstrap3，您可以向父级添加一个类，使其成为

flex

行，然后使用

align items:center

垂直居中。您可能还希望通过删除该填充，或将其作为填充或边距添加到右侧列/输入，来匹配

.control label

元素的默认

padding top:7px

值，具体取决于布局的其余部分

.form-group.valign{
显示器：flex；
对齐项目：居中；
}
@介质（最小宽度：768px）{
.有效输入{
边缘顶部：7px；
}
}

未通过的确认书：

这是bootstrap 3吗？谢谢@Michael！！flexbox工作得非常好。我只是将媒体查询替换为：media（max width:768px）{.form-group.valign{display:block；}}，以获得小屏幕上的默认行为。