纸影破坏了所需的布局

Question

考虑这个标记：

<custom-element horizontal layout>
    <div>Some text here</div>
    <div flex><i>space</i></div>
    <paper-toggle-button></paper-toggle-button>
</custom-element>

custom-element声明如下：

<polymer-element name="custom-element" noscript>
    <template>
        <paper-shadow z="1">
            <content flex></content>
        </paper-shadow>
    </template>
</polymer-element>

具有div属性的中间flex应该填充所有可用空间，但如果paper-shadow存在则不会。这是一个比较（顶部是paper-shadow）：

为什么会这样？

Answer 1

我在输入答案时想出了一个解决方案，所以这里是：

<polymer-element name="custom-element" noscript>
    <template>
        <paper-shadow flex horizontal layout z="1">
            <content flex></content>
        </paper-shadow>
    </template>
</polymer-element>