角料md-input-container不会垂直居中

时间:2016-03-04 12:59:02

标签: html css angularjs angular-material

我使用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中并设置layout-align to start,center。
  • 使用表单标记来包装输入容器。

问题:

输入组不会垂直居中,这就是我所追求的。我尝试过的其他指令完全像md按钮。

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

编辑(添加图片比较,md-input-container,输入,md按钮):

enter image description here

2 个答案:

答案 0 :(得分:11)

你试过吗

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

答案 1 :(得分:0)

md-input-container具有规范{margin:18px 0;}中的此规则来考虑验证,您可以通过创建自定义明确边距类{margin:0!important}来覆盖它。