Core Code
Core Code Modern Dev Handbook

CSS Hover Dropdown

Dropdown content appears when hovering over the trigger.

Preview

Code

<style>
.dropdown{
position:relative;
display:inline-block;
}

.menu{
display:none;
position:absolute;
background:#e0f2fe;
padding:10px;
}

.dropdown:hover .menu{
display:block;
}
</style>

<div class="dropdown">
Hover me
<div class="menu">Dropdown item</div>
</div>

More CSS Dropdowns Examples (8)

example CSS Basic Dropdown open example example CSS Dropdown Menu List open example example CSS Dropdown Button open example example CSS Right Aligned Dropdown open example example CSS Dropdown With Icon open example example CSS Card Style Dropdown open example example CSS Navbar Dropdown open example example CSS Animated Dropdown open example