eddirae 1 Posted April 22 Report Share Posted April 22 Hello, Using the "Navigation Bar with Dropdown", I am creating a dropdown under another dropdown. When you run it, the dropdown under the dropdown shows as well. How do I have it so that it doesn't show until I hover over the sub dropdown? Here is the code <!DOCTYPE html> <html> <title>W3.CSS</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"> <body> <div class="w3-container"> <h2>Navigation Bar with Dropdown</h2> <p>Add a dropdown menu inside the navigation bar:</p> <div class="w3-bar w3-light-grey"> <a href="#" class="w3-bar-item w3-button">Home</a> <a href="#" class="w3-bar-item w3-button">Link 1</a> <div class="w3-dropdown-hover"> <button class="w3-button">Dropdown1</button> <div class="w3-dropdown-content w3-bar-block w3-card-4"> <a href="#" class="w3-bar-item w3-button">Link 1</a> <a href="#" class="w3-bar-item w3-button">Link 2</a> <a href="#" class="w3-bar-item w3-button">Link 3</a> <div class="w3-dropdown-hover"> <button class="w3-button">Dropdown2</button> <div class="w3-dropdown-content w3-bar-block w3-card-4"> <a href="#" class="w3-bar-item w3-button">Link 4</a> <a href="#" class="w3-bar-item w3-button">Link 5</a> <a href="#" class="w3-bar-item w3-button">Link 6</a> </div> </div> </div> </div> </div> </div> </body> </html> Thanks in advance for your help!! Eddi Rae Quote Link to post Share on other sites
Vishal_N 0 Posted April 24 Report Share Posted April 24 Like This https://codepen.io/vishalneswankar/pen/PoPpGgo Quote Link to post Share on other sites
eddirae 1 Posted April 24 Author Report Share Posted April 24 Thanks Vishal_N for your post. I am not seeing a CSS for the w3-bar-none. Could you elaborate on this, please? Eddi Rae Quote Link to post Share on other sites
Michele Costantino 0 Posted April 25 Report Share Posted April 25 Is it possible to have link 4,5,6 on the right of of dropdown2 ? I'm fighting with this since 3 days... Quote Link to post Share on other sites
eddirae 1 Posted April 26 Author Report Share Posted April 26 Hello Vishal_N. I got your example to work as a standalone. The issue now is that I have this in a master file and it is not working. It opens all items. Quote Link to post Share on other sites
shaili_shah 0 Posted May 8 Report Share Posted May 8 On 4/25/2020 at 5:08 PM, Michele Costantino said: Is it possible to have link 4,5,6 on the right of of dropdown2 ? I'm fighting with this since 3 days... So you can use this css : position: relative; left: 100%; top: 0; Hope it'll help. Thanks! Quote Link to post Share on other sites
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.