<!DOCTYPE html>
<html lang="en">
<head>
<style>
.navbar a {
float: left;
}
.dropdown {
float: left;
overflow: hidden;
}
.dropdown-content a {
float: none;
display: block;
}
/* hide the dropdown content */
.dropdown-content {
display: none;
position: absolute;
z-index: 1;
}
/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
display: block;
}
</style>
</head>
<body>
<div class="navbar">
<a href="#home">Home </a>
<a href="#news">News </a>
<div class="dropdown">
<button class="dropbtn">Dropdown</button>
<div class="dropdown-content">
<a href="#">Link 1</a>
<a href="#">Link 2</a>
</div>
</div>
</div>
</body>
</html>