material-design-lite/src/menu/snippets/top-right-demo.html

Material Design Components in CSS, JS and HTML

<style>
  .demo-menu.demo-menu__top-right .container {
    position: relative;
    width: 200px;
  }
  .demo-menu.demo-menu__top-right .background {
    background: white;
    height: 148px;
    width: 100%;
  }
  .demo-menu.demo-menu__top-right .bar {
    box-sizing: border-box;
    position: relative;
    background: #3F51B5;
    color: white;
    height: 64px;
    width: 100%;
    padding: 16px;
  }
  .demo-menu.demo-menu__top-right .wrapper {
    box-sizing: border-box;
    position: absolute;
    right: 16px;
  }
</style>

<div class="container mdl-shadow--2dp">
  <div class="background"></div>
  <div class="bar">
    <div class="wrapper">
      {% include "top-right.html" %}
    </div>
  </div>
</div>