title: How can I make core-menu fit the compleet viewport?
body: <p>Because of scroll issues in the current paper-dropdown-menu implementation I want to make core-menu fit the complete viewport when you click on paper-dropdown-menu, tried many things but can not figure it out and I am stuck in the shadow dom space.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  
  &lt;head&gt;
    &lt;meta charset="utf-8" /&gt;
    &lt;meta http-equiv="X-UA-Compatible" content="IE=edge" /&gt;
    &lt;meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes" /&gt;
    &lt;title&gt;Polymer&lt;/title&gt;
    &lt;script src="https://www.polymer-project.org/0.5/components/webcomponentsjs/webcomponents.js"&gt;&lt;/script&gt;
    &lt;link href="https://www.polymer-project.org/0.5/components/polymer/polymer.html" rel="import" /&gt;
    &lt;link href="https://www.polymer-project.org/0.5/components/core-elements/core-elements.html" rel="import" /&gt;
    &lt;link href="https://www.polymer-project.org/0.5/components/paper-elements/paper-elements.html" rel="import" /&gt;
    &lt;link rel='stylesheet' href='//fonts.googleapis.com/css?family=RobotoDraft:regular,bold&amp;amp;lang=en'&gt;
    &lt;style shim-shadowdom&gt;
      body {
        font-family: 'RobotoDraft', sans-serif;
      }
      :unresolved {
        display: flex;
        justify-content: flex-start;
        background: rgba(255, 255, 255, 0.5);
        border: 2px dashed #ccc;
        border-radius: 5px;
        box-sizing: border-box;
      }
      :unresolved:after {
        padding: 15px;
        content: 'loading...';
        color: #ccc;
      }
      paper-dropdown-menu {
        border: 2px solid red;
        border-radius: 5px;
        box-sizing: border-box;
      }
    &lt;/style&gt;
  &lt;/head&gt;
  
  &lt;body fullbleed layout vertical&gt;
    &lt;template is="auto-binding"&gt;
      &lt;paper-dropdown-menu label="method"&gt;
        &lt;paper-dropdown class="dropdown"&gt;
          &lt;core-menu class="menu" fullbleed style="margin:0; padding:0;"&gt;
            &lt;template repeat="{{ method }}"&gt;
              &lt;paper-item&gt;{{}}&lt;/paper-item&gt;
            &lt;/template&gt;
          &lt;/core-menu&gt;
        &lt;/paper-dropdown&gt;
      &lt;/paper-dropdown-menu&gt;
    &lt;/template&gt;
    &lt;script&gt;
      var t = document.querySelector('body &gt; template')
       t.method = [1, 2, 3, 4]
    &lt;/script&gt;
  &lt;/body&gt;
  
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>