Pure CSS dropdown triggered my click

by alsweeet

HTML

<div id="dd">
	<a href="#" id="button">Select Language</a>
	<ul>
		<li>English</li>
		<li>French</li>
		<li>German</li>
		<li>Spanish</li>
	</ul>
</div>

CSS

ul{
    display: none;
    position: relative;
    top: -55px;
    padding: 55px 0 0 0;
    margin: 0;
}
ul:hover{
    display: block; 
}
li{
    background: #ddd;
    padding: 10px;
    list-style: none;.
}
li:hover{ 
    background: #eee;
    cursor: pointer;
}
#button{
    display: inline-block;
    padding: 10px;
    background: #ccc;
    color: white;
}
#dd{
    display: inline-block;
}
#dd:active ul{
    display: block;
} 
#dd:aactive ul:hover{
    display: block;
}
#dd:active #button{
    display: inline-block;
    padding: 10px;
    background: #ccc;
    color: white;
}