【问题标题】:angular material md-input-container won't center vertically角度材料 md-input-container 不会垂直居中
【发布时间】:2016-06-18 05:28:41
【问题描述】:

我正在使用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 设置为 start, center。
  • 使用表单标签包装输入容器。

问题:

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

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

编辑(添加图片比较、md-input-container、input、md-button):

【问题讨论】:

    标签: html css angularjs angular-material


    【解决方案1】:

    你试过了吗

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

    【讨论】:

    • 是的,我刚刚尝试将其添加到 css 文件中。这有效!
    • 很高兴听到。谢谢
    【解决方案2】:

    md-input-container 在规范 {margin: 18px 0;} 中有这个规则来说明验证,您可以通过创建自定义 clear-margin 类 {margin: 0 !important} 来覆盖它。

    【讨论】:

    • 用下面的方法试过了:,可惜没用。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-06-01
    • 1970-01-01
    • 2016-12-30
    • 2017-05-03
    • 2017-12-29
    相关资源
    最近更新 更多