聚合物1.0 - 如何在屏幕上保持紙張下拉菜單？

Question

這就是我的代碼的樣子。

<div class="horizontal layout flex wrap center-justified"> 
    <paper-material elevation='1'> 
    <div class='horizontal layout'> <span>Some Data</span> <span> 
     <paper-icon-button icon='more-vert'></paper-icon-button> 
     <paper-dropdown-menu> 
     <paper-material id='drop-install'> 
      <paper-menu> 
      <paper-item id='paper-drop-item'>Tap1</paper-item> 
      <paper-item id='paper-drop-item'>Tap2</paper-item> 
      <paper-item id='paper-drop-item'>Tap3</paper-item> 
      </paper-menu> 
     </paper-material> 
     </paper-dropdown-menu> 
     </span> </div> 
    </paper-material> 
    <paper-material elevation='1'> 
    <div class='horizontal layout'> <span>Some Data</span> <span> 
     <paper-icon-button icon='more-vert'></paper-icon-button> 
     <paper-dropdown-menu> 
     <paper-material id='drop-install'> 
      <paper-menu> 
      <paper-item id='paper-drop-item'>Tap1</paper-item> 
      <paper-item id='paper-drop-item'>Tap2</paper-item> 
      <paper-item id='paper-drop-item'>Tap3</paper-item> 
      </paper-menu> 
     </paper-material> 
     </paper-dropdown-menu> 
     </span> </div> 
    </paper-material> 
</div> 

我相信一切完美。

，但是，當我在第二篇文章中，圖標按鈕，在屏幕的右端攻，紙張下拉菜單離開顯示。

所以，我希望所有的紙張下拉菜單都在屏幕內。請支持我解決這個問題。

Answer 1

嘗試使用這種樣式：

.dropdown-content{ 
    position: fixed; 
    right: 0px; 
    } 

上：

<paper-menu-button class="flex-options"> 
     <paper-icon-button icon="more-vert" class="dropdown-trigger"></paper-icon-button> 
      <paper-menu class="dropdown-content" attr-for-selected="data-route" selected="[[route]]"> 
       <paper-item class="item-hover"> 

我有同樣的問題，我的內容去關閉屏幕。 這種造型解決了我的問題。