谷歌MDL瀑布头不滚动滚动和身体右侧的滚动条

数据以下显示Google MDL页面的标题和主体。我正在尝试使用瀑布标题 - 滚动时标题会缩小。谷歌MDL瀑布头不滚动滚动和身体右侧的滚动条

下面的页面是我的头部不滚动，我得到一个滚动条在身体的右侧。

那么我怎么设置这个瀑布标题缩小呢？浏览器是IE10）

<div class="mdl-layout mdl-js-layout"> 
    <header class="mdl-layout__header mdl-layout--waterfall"> 
     <div class="mdl-layout__header-row"> 
      <div class="mdl-layout__title"> 
       Document Management 
      </div> 
      <div class="mdl-layout-spacer"></div> 
      <div class="mdl-textfield mdl-js-textfield mdl-textfield--expandable 
       mdl-textfield--floating-label mdl-textfield--align-right" id="searchBox"> 
       <label class="mdl-button mdl-js-button mdl-button--icon" for="srchText"> 
        <i class="material-icons">search</i> 
       </label> 
       <div class="mdl-textfield__expandable-holder"> 
        <input class="mdl-textfield__input" type="text" name="sample" id="srchText" /> 
       </div> 
      </div> 
     </div> 
     <div class="mdl-layout__header-row"> 

     </div> 
    </header> 
    <main class="mdl-layout__content"> 
     <div class="mdl-grid search-result-width page-content" id="contentGrid"> 
      <!--Dummy--> 
      <div class="mdl-card mdl-shadow--2dp card-width"> 
       <div> 
        <div class="mdl-card__title"> 
         <h2 class="mdl-card__title-text"> 
          Name 
         </h2> 
         <div class="mdl-layout-spacer"></div> 
         <i class="material-icons">person</i> 
        </div> 
        <div class="mdl-card__supporting-text"> 
         <p> 
          An Address       </p> 
        </div> 
        <div class="mdl-card__actions mdl-card--border"> 
         <a class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect" href="patientDocumentList.html?Id=08029aa4800b0ff6">DETAILS</a> 
        </div> 
       </div> 
      </div> 

     </div> 
    </main>

来源

2016-03-02 Paul S Chapman

在

你<header class="mdl-layout__header mdl-layout__header--waterfall">你已经错过了mdl-layout__header--waterfall为你写mdl-layout--waterfall

来源

2016-03-03 06:07:46

谷歌MDL瀑布头不滚动滚动和身体右侧的滚动条

回答

相关问题