html - polymer 网格布局中的最后一行

我目前正在尝试使用聚合物制作网格布局。

   <div layout wrap horizontal justified class="projects">
      <template repeat="{{project in team['projects']}}">
        <item project="{{project['id']}}">
            <div>{{project['name']}}</div>
        </item>
      </template>
  </div>

它适用于除最后一行以外的所有行。最后一行没有足够的元素来完全填满该行，由于“ justified”属性，该行的子项平均分配在该行中。但是，我希望它们彼此之间与其他行中的项目具有相同的空间，并向左对齐，以便它们不会填满整个行。

对于我的理解，这不适用于属性'justified'。但是我可以用什么来使其工作呢？我只是找不到解决方案。

可以在here中找到此问题的示例。

最佳答案

好像您正在使用“ space-around” ..您应该使用“ flex-start”。预览弹性框的好工具在这里：http://the-echoplex.net/flexyboxes/

这是带有示例的链接：http://the-echoplex.net/flexyboxes/?fixed-height=on&legacy=on&display=flex&flex-direction=row&flex-wrap=wrap&justify-content=flex-start&align-items=flex-start&align-content=flex-start&order%5B%5D=0&flex-grow%5B%5D=0&flex-shrink%5B%5D=1&flex-basis%5B%5D=auto&align-self%5B%5D=auto&order%5B%5D=0&flex-grow%5B%5D=0&flex-shrink%5B%5D=1&flex-basis%5B%5D=auto&align-self%5B%5D=auto&order%5B%5D=0&flex-grow%5B%5D=0&flex-shrink%5B%5D=1&flex-basis%5B%5D=auto&align-self%5B%5D=auto&order%5B%5D=0&flex-grow%5B%5D=0&flex-shrink%5B%5D=1&flex-basis%5B%5D=auto&align-self%5B%5D=auto&order%5B%5D=0&flex-grow%5B%5D=0&flex-shrink%5B%5D=1&flex-basis%5B%5D=auto&align-self%5B%5D=auto&order%5B%5D=0&flex-grow%5B%5D=0&flex-shrink%5B%5D=1&flex-basis%5B%5D=auto&align-self%5B%5D=auto&order%5B%5D=0&flex-grow%5B%5D=0&flex-shrink%5B%5D=1&flex-basis%5B%5D=auto&align-self%5B%5D=auto

关于html - polymer 网格布局中的最后一行，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/28942347/