在 Polymer 2 中使用 CSS mixin 覆盖内联样式

Question

有没有办法用 CSS mixin 覆盖 Polymer 2 中组件的 内联样式 ？

在 Polymer 1 中，我的组件中有一个类似于下面的代码来执行此操作，它工作正常（参见 #1 图片）：

<style>
    paper-menu-button {
        display: block;

        --paper-menu-button-dropdown: {
            position: relative !important;
            top: auto !important;
            left: auto !important;
            display: block;
        };

        --paper-menu-button-content: {
            max-width: none !important;
            max-height: none !important;
            display: block;
        };
    }
</style>

但是对于 Polymer 2，它不再起作用（参见 #2 图片）。

JS bin 对于聚合物 2。

1.聚合物 1： CSS:

输出：

2。聚合物 2： CSS:

输出：

谢谢！

Answer 1

在--paper-menu-button-dropdown中添加width:100%;。

工作JS Bin。

此外，请注意我已将箭头图标的 iron-icon.html 更改为 iron-icons.html。

在 Polymer 2 中使用 CSS mixin 覆盖内联样式

Override inline style with a CSS mixin in Polymer 2

css

polymer

polymer-2.x