角度材质设计布局="行"内容与窗口重叠

CEN*_*EDE 2 html css angularjs angular-material

所以这是我的HTML

<div id="someId">
    <div layout="column" layout-padding>
        <h3 class="someClass" align="center">Week 2</h3>
        <div layout="row"  style="outline: 1px solid red">

            <!-- <div ng-repeat="doge in Doges">
                // contents
            </div> -->

        </div>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

这产生了这个: 在此输入图像描述 红色轮廓是浏览器的实际宽度.为什么第5项经过而不是下一行呢?

CEN*_*EDE 6

实际上我只是layout-wrap为了<div layout="row" style="outline: 1px solid red">它会自动包装内容.

<div id="someId">
    <div layout="column" layout-padding>
        <h3 class="someClass" align="center">Week 2</h3>
        <div layout="row" layout-wrap  style="outline: 1px solid red">

            <!-- <div ng-repeat="doge in Doges">
                // contents
            </div> -->
        </div>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)