2016-04-22 8 views
0

Wenn ich paper-drawer-panel verwende, ist das Ansichtsfenster nicht korrekt. Wie im ersten Screenshot gezeigt, ist die Y-Bildlaufleiste da, wie sie sein sollte .... aber der untere Teil des Ansichtsfensters ist nicht gleich dem Ende/Ende der y Bildlaufleiste. Andererseits wird immer noch ein Teil des Inhalts nicht angezeigt, der versteckt ist.Paper-Drawer-Panel bewirkt, dass die Y-Scrollleiste nicht zum unteren Bereich des Viewports scrollt

Wenn ich paper-drawer-panel entferne, dann ist alles gut und die Y-Bildlaufleiste scrollt zum unteren Rand des Ansichtsfensters.

Dies ist in index.html.

Bad - mit paper-drawer-panel:

paper-drawer-panel messes up bottom of viewport

<template is="dom-bind" id="app"> 
    <paper-drawer-panel force-narrow="true"> 
     <div drawer> 
     <drawer-custom></drawer-custom> 
     </div> 
     <div main> 
     <div id="header-v-center"> 
      <paper-icon-button id="paper-toggle" icon="menu" paper-drawer-toggle> 
      </paper-icon-button> 
      <div id="header-text-middle">SPICES OF THE WORLD</div> 
      <div id="header-text-right">A SPECIAL EDITION! </div> 
     </div> 
     <div id="video-player-header" onclick="page('/home')" style="display: none"> 
      <div> 
      <iron-icon icon="icons:arrow-back"></iron-icon> 
      </div> 
     </div> 
     <video-selection></video-selection> 
     <video-player></video-player> 
     </div> 
    </paper-drawer-panel> 
    </template> 

GUT - ohne paper-drawer-panel:

No paper-drawer-panel...viewport bottom is shown

<template is="dom-bind" id="app"> 
     <div main> 
     <div id="header-v-center"> 
      <paper-icon-button id="paper-toggle" icon="menu" paper-drawer-toggle> 
      </paper-icon-button> 
      <div id="header-text-middle">SPICES OF THE WORLD</div> 
      <div id="header-text-right">A SPECIAL EDITION! </div> 
     </div> 
     <div id="video-player-header" onclick="page('/home')" style="display: none"> 
      <div> 
      <iron-icon icon="icons:arrow-back"></iron-icon> 
      </div> 
     </div> 
     <video-selection></video-selection> 
     <video-player></video-player> 
     </div> 
    </template> 

Antwort

2

Ohne die Live-Seite zu sehen, wahrscheinlich haben Sie eine Höhe : 100%; für Ihren Inhaltsbereich, wenn es Höhe sein soll: calc (100% - Xpx); Wobei X die Höhe Ihrer Kopfzeile ist.