angular material md-input-container 不会垂直居中

Question

我正在使用 angular material 来设计我的项目。现在我想要一个在我的工具栏中搜索的输入，就像 youtube 一样。

我的代码：

<md-list flex-offset="10">
    <md-list-item layout-align="start center">
        <md-input-container md-no-float flex>
            <input type="text" placeholder="Search" flex>
        </md-input-container>
        <md-button> test </md-button>
    </md-list-item>
</md-list>

我的 md-list 之前的工具栏标签如下所示：

<md-toolbar layout="row" flex style="max-height: 60px;">
    <div class="md-toolbar-tools">

我尝试过的：

将它包裹在正常的 div 中并将布局对齐设置为开始，居中。
使用表单标签包装输入容器。

问题：

输入组不会垂直居中，这就是我想要的。我尝试过的所有其他指令都像 md 按钮一样完美地居中。

这是一个错误还是我做错了什么？

编辑（添加图片比较、md-input-container、input、md-button）：

Answer 1

md-input-container 有来自规范 {margin: 18px 0;} 的这条规则来考虑验证，你可以通过自定义 clear-margin class {margin: 0 !important }.

Answer 2

你试过了吗

md-input-container .md-errors-spacer{
 min-height: 0px !important;
}

angular material md-input-container 不会垂直居中

angular material md-input-container won't center vertically

html

css

angularjs

angular-material