<iron-list> 具有网格属性，每行仅显示一项

Question

我想将 Polymer 目录中的项目用作网格。
我已经在列表中设置了 grid 属性，并为 children 指定了固定的宽度和高度。
但是，每一行只包含一个 child.
这是我的代码：

这是我的自定义元素的容器，其中包含 iron-list

<div style="height: 675px;">
    <cit-entity-card-container card-data="[[cardData]]"></cit-entity-card-container>
</div>

这是我的自定义元素

<dom-module id="cit-entity-card-container">

<style include="cit-shared-styles">
    :host {
        @apply(--layout-horizontal);
        @apply(--layout-wrap);
        margin: 0 8px 0 0;
        height: 100%;
        border-radius: 5px;
        background-color: var(--cit-white);
        box-sizing: border-box;
        padding: 16px 0 16px 0;
        display: block;
    }

    iron-list {
        height: 675px;
    }
</style>

<template>
    <iron-list items="[[cardData]]" as="item" grid>
        <template>
            <div style="width: 100px; height: 100px;">100x100</div>
        </template>
    </iron-list>
</template>

<script>
    Polymer({
        is: 'cit-entity-card-container',

        properties: {
            cardData: {
                type: Array,
                value: function() { return []; }
            }
        }
    });
</script>

这是它的样子：

Answer 1

我解决了
最后很简单，但确实让我有些紧张。

我的 iron-list 比最新版本落后一些
通过 bower 更新（bower --force update）
问题已解决

<iron-list> 具有网格属性，每行仅显示一项

<iron-list> with grid attribute only shows one item per row

css

polymer-1.0