Polymer 聚合物1.0响应柱

以下是我希望通过聚合物元素实现的目标：

列大小并不总是相同的宽度，而是相对于屏幕或warpper div大小。在示例1中，其各为16.66%，在示例2中为33.33%，在示例3中应为100%

我需要一个响应性的布局，根据屏幕大小，每行显示不同数量的列，并且每个列的大小都将进行调整

有人知道我怎样才能做到这一点吗？我对如何使用

flex

和

layout horizontal

/

layout vertical

感到有点困惑

如果有一个关于代码和结果如何的codepen（或类似）示例，我将非常感激

---

更新：我在这里找到了解决方案：

您可以使用设置元素的属性，根据该属性值将CLSS应用于HTML元素，然后根据设置的类应用不同的CSS

我大概知道你的意思，但如果有人能举个例子就好了。我想你也指的是定制样式中的@apply方法，我并没有真正理解。更准确地说，我不知道如何设置每行的最大列数。是的，

@apply（）

通常是使用

iron flex布局的方式。我只知道如何在技术上实现我上面解释的内容。不过，我还没有对flex布局本身做任何处理。如果你在你的问题中添加具体的代码/html来展示你真正想要完成的事情，这可能会有所帮助。这就是问题的一部分。我制作这张图片是为了展示我想要实现的目标，因为我尝试的x解决方案中没有一个是可行的…：（例如，我试图为@media screen和（最大宽度：768px）{.flex-6{flex:1！重要；}}}添加内容。我认为这会覆盖1/6 flex并使其100%灵活。不起作用。。。