javascript - Angular Material - 为什么我的 md-button 是全 Angular 的？

Question

简单的问题，我制作了一个非常基本的页面来使用 Angular Material。我有一个在中型设备上可见的按钮，可以切换侧面导航，并且由于某种原因它是全宽的。没有使它全宽的 CSS，也没有使它全宽的 Material 指令。它似乎继承了它所在容器的宽度，但我不明白为什么。

有一点 Angular Material 知识的人能明白为什么吗？ (只需调整 Pane 大小即可看到按钮)

这是我的 CodePen:

http://codepen.io/anon/pen/jPYNzy

还有代码:

<!-- Container -->
<div layout="column" layout-fill>
    <div layout="row" flex>

        <!-- Content -->
        <md-content flex>

            <md-toolbar>
                <div class="md-toolbar-tools">
                    <h1>Title</h1>
                </div>
            </md-toolbar>

            <div layout="column" class="md-padding">
                <p>
                The left sidenav will 'lock open' on a medium (>=960px wide) device.
                </p>
                <md-button ng-click="toggleLeft()" hide-gt-md>
                    Toggle left
                </md-button>
            </div>

        </md-content><!-- ./Content -->

    </div>
</div><!-- ./Container -->

Answer 1

Just wrap it in another div 如果这是不希望的。 <div layout="column"> 的 flex 方向似乎对行为负责。