Float Method of Horizontal Menu Styling
Using float to create a horizontal menu is pretty old school: these days we use flexbox. However, when it comes to making a dropdown menu, using float is somewhat easier than flexbox, so we'll learn one menu using float. BTW, float is used for text wrap around images, so if you ever want that, float is the way it happens. We didn't learn float, so there's a lot I'll be talking about, but when we do dropdowns, I'll talk about it again.
This method uses the float property on the list item element so that they will display side by side. The advantage to this method is that you retain the block display box so that you can use display: block on the anchor tag. Padding on a block-display anchor tag makes the "button" (height and width).
The disadvantage to float is that you will get collapsing containers and (potentially) float drop that you need to accommodate. For simple menus, overflow: auto
on the nav will fix the collapsed container. You probably won't get float drop on this kind of float menu unless you have a lot of links in your menu.