Untitled

dabblet.css

.wrapper{
width:200px;
height:30px;
background:red;
position:relative;
}
.content{
position:absolute;
z-index:1;
top:0;
padding-top:30px;
display:none;
}
.parent{
position:absolute;
z-index:2;
}
.wrapper:active .content{
display:block;
z-index:3;
}
.content:hover{
display:block;
z-index:3;
}
.parent{
width:200px;
height:30px;
}
.parent:hover{
background:yellow;
}
.parent:active{
background:green;
}

dabblet.html

<div class="wrapper">
	<div class="parent">Drop Down Parent 1</div>
	<div class="content">
		<ul>
			<li><a href="#">Lorem ipsum dolor</a></li>
			<li><a href="#">Consectetur adipisicing</a></li>
			<li><a href="#">Reprehenderit</a></li>
			<li><a href="#">Commodo consequat</a></li>
		</ul>
	</div>
</div>

settings.json

{"view":"split","seethrough":"","prefixfree":"1","page":"all"}