I am using the W3.CSS menu system to create a dropdown from a hamburger icon. The problem comes when I am attempting to create a cascading dropdown from one of those menu items. I have tried a number of variations and can't see to get it right. Any help would be appreciated.
<body>
<div style="display:block-inline;float:left" id="iconMenu" class="w3-container">
<div class="w3-dropdown-hover">
<button class="w3-button w3-blue-gray"><i class="fa-solid fa-bars fa-2x"></i></button>
<div class="w3-dropdown-content w3-bar-block w3-border">
<a class="w3-bar-item w3-button">Home</a>
<a class="w3-bar-item w3-button">Link 1</a>
<a class="w3-bar-item w3-button">Link 2</a>
<button class="w3-button">Dropdown Again <i class="fa fa-caret-right"></i></button>
<a class="w3-bar-item w3-button">Link 3</a>
</div>
</div>
</div>
</body>