聚合物

Question

我正在学习聚合物。我喜欢它的很多东西。然而，当谈到造型项目时，我发现它有点复杂。目前，我正试图设置一个下拉列表，我似乎无法做一个基本的事情。我创建了Plunk here。代码如下所示：

<paper-dropdown-menu label="Team">
  <paper-listbox class="dropdown-content">
    <paper-item>Broncos</paper-item>
    <paper-item>Panthers</paper-item>
    <paper-item>Patriots</paper-item>
  </paper-listbox>
</paper-dropdown-menu>

我正在尝试使下拉箭头（v）显示在所选项目的文本旁边，而不是显示在下拉菜单的最右侧。此外，我试图使列表框显示容器的宽度并正确定位。但是，我没有运气。我试过在下拉内容类中添加填充和边距而没有任何运气。

Answer 1

不是将这些样式标记添加到div，而是将其添加到paper-dropdown-menu，它应该有效。对我来说它不适用于IE

paper-dropdown-menu{
     background-color:silver;
     padding-left:48px;
     padding-right:48px;
      width:124px;
   }

我创建了Plunk here

Answer 2

通过查看paper-dropdown-menu上的演示，您可以看到它们使用text-align将文本居中。因此将其更改为text-align：right;它与箭头对齐。

不确定这是否是您要找的。

paper-dropdown-menu {
  --paper-input-container-underline: {
    display: none;
  }
  --paper-input-container-label: {
    text-align: right;
  }
  paper-item {
    --paper-item-selected-weight: 400;
    --paper-item-focused-before: {
      background: #fff;
    }
  }
}

Plunk here