Заголовок шторки

Фиксированная шторка

Без шапки. Шторка открыта на больших экранах.

Добавляется набор классов для первого блока div


<div class="mdl-layout mdl-js-layout mdl-layout--fixed-drawer">

Исходный код


<html>
   <head>
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
      <link rel="stylesheet" href="https://code.getmdl.io/1.2.1/material.indigo-pink.min.css">
      <script defer src="https://code.getmdl.io/1.2.1/material.min.js"></script>
   </head>
<body>

   <div class="mdl-layout mdl-js-layout mdl-layout--fixed-drawer">
      <div class="mdl-layout__drawer">
         <span class="mdl-layout-title">Заголовок шторки</span>
         <nav class="mdl-navigation">
            <a class="mdl-navigation__link" href="">Первая ссылка в шторке</a>
            <a class="mdl-navigation__link" href="">Вторая ссылка в шторке</a>
             <a class="mdl-navigation__link" href="">Третья ссылка в шторке</a>
         </nav>
      </div>
      <main class="mdl-layout__content">
         <div class="page-content" style="padding-left:100px;">
             <h1>Фиксированная шторка</h1>
             
             <p>Без заголовка. Шторка открыта на больших экранах.</p>

             
             
          </div>
      </main>
    </div>
</body>
</html>