1[![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://beta.webcomponents.org/element/PolymerElements/paper-dropdown-menu) 2[![Build status](https://travis-ci.org/PolymerElements/paper-dropdown-menu.svg?branch=master)](https://travis-ci.org/PolymerElements/paper-dropdown-menu) 3 4##<paper-dropdown-menu> 5 6Material design: [Dropdown menus](https://www.google.com/design/spec/components/buttons.html#buttons-dropdown-buttons) 7 8`paper-dropdown-menu` is similar to a native browser select element. 9`paper-dropdown-menu` works with selectable content. 10 11<!--- 12``` 13<custom-element-demo> 14 <template> 15 <script src="../webcomponentsjs/webcomponents-lite.js"></script> 16 <link rel="import" href="paper-dropdown-menu.html"> 17 <link rel="import" href="../paper-item/paper-item.html"> 18 <link rel="import" href="../paper-listbox/paper-listbox.html"> 19 <link rel="import" href="../iron-demo-helpers/demo-pages-shared-styles.html"> 20 <style is="custom-style" include="demo-pages-shared-styles"> 21 paper-dropdown-menu, paper-listbox { 22 width: 250px; 23 } 24 paper-dropdown-menu { 25 height: 200px; 26 margin: auto; 27 display: block; 28 } 29 </style> 30 <next-code-block></next-code-block> 31 </template> 32</custom-element-demo> 33``` 34--> 35```html 36<paper-dropdown-menu label="Dinosaurs"> 37 <paper-listbox class="dropdown-content" selected="1"> 38 <paper-item>allosaurus</paper-item> 39 <paper-item>brontosaurus</paper-item> 40 <paper-item>carcharodontosaurus</paper-item> 41 <paper-item>diplodocus</paper-item> 42 </paper-listbox> 43</paper-dropdown-menu> 44``` 45