Untitled

dabblet.css

ul,li {
  margin: 0;
  padding: 0;
  list-style: none;
}
a {
  color: inherit;
  text-decoration: none; 
}

.menu > li {
  position: relative;
  float: left;
  width: 25%;
}
.menu > li > a {
  background: #6AB;
  text-align: center;
  color: #FFF;
}
.submenu {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
}
.submenu > li {
  float: none;
  width: 100%
}
.submenu > li > a {
  background: #DEF;
  color: #489;
}

dabblet.html

<div class="navigation">
  <ul class="menu">
  	<li><a href="#menu">メニュー</a></li>
  	<li><a href="#menu">メニュー</a></li>
  	<li><a href="#menu">メニュー</a></li>
  	<li>
  	  <a href="#menu">メニュー</a>
  	  <ul class="submenu">
  	  	<li><a href="#submenu">サブメニュー</a></li>
  	  	<li><a href="#submenu">サブメニュー</a></li>
  	  	<li><a href="#submenu">サブメニュー</a></li>
  	  </ul>
  	</li>
  </ul>
</div>

dabblet.js

// alert('Hello world!');

settings.json

{"view":"split-vertical","fontsize":"160","seethrough":"","prefixfree":"1","page":"all"}