4

layout-align 属性を使用して、カードの入力/編集テキストを中央揃えにしようとしています。しかし、私の無知と幼少期 (今日から学習を始めました) のため、編集テキストがこのカード ビュー内で中央揃えにならない理由を理解できません。

<div flex="50" layout="row" layout-align="center">
    <md-card flex="50">
        <md-input-container layout-align="center center" class="md-block" flex="50">
            <input required type="text" placeholder="Observation Number" ng-model="learningCenter.observations.obsNum" />
        </md-input-container>
    </md-card>
</div>

デモはこちら: https://codepen.io/camden-kid/pen/zBQZLW?editors=1010#0

4

2 に答える 2

0

を中央に配置するにmd-input-containerは、 で囲む必要がdivありますlayout="row"。これにより、水平方向に整列させることができますが、垂直方向に整列させるには、divいくつかのheight. あなたはこのようmd-cardに見えるはずです:heightmd-input-container

<md-card flex="50">
    <div layout="row" layout-align="center center" style="min-height: 100%">
        <md-input-container class="md-block" flex="50">
            <input required type="text" placeholder="Observation Number"
                ng-model="learningCenter.observations.obsNum"/>
        </md-input-container>
    </div>
</md-card>

これがあなたのコードの作業フォークです。

于 2016-11-15T17:59:02.650 に答える