Hi guys I am new here in stack overflow and i am a beginner in programming. Can someone please tell me how I can improve my current HTML code of a navigation bar so that it displays a drop down menu without using Java script? The code below is the particular code I am trying to edit. i am trying to edit the investment menu in the navigation so that it displays a dropdown

<ul class="nav">
                      <li><a href="index.html" class="active">Home</a></li>
                      <li><a href="">About Us</a></li>
                      <li class="dropdown"><input type="checkbox" id="dropdownToggle1">
                        <label for="dropdownToggle1">Investments</label>
                        <div class="dropdown-content">
                          <a href="file:///C:/xampp/htdocs/templatemo_591_villa_agency/stock%20investment.html">Stock investment</a>
                          <a href="#">Real Estate</a>
                        </div>
                      </li>  
                      <li><a href="">Apply</a></li>
                      <li><a href="property-details.html">Property Details</a></li>
                      <li><a href="contact.html">Contact Us</a></li>
                      <li><a href="#"><i class="fa fa-calendar"></i> Schedule a visit</a></li>
                  </ul>   

If you want to see the full code, this is my work on Codepen: my work

I inserted a <li class=”> tag for the klist within the unordered list and a <div class=”dropdown-content for the actual drop down and included them both in my CSS, all of whgich can be found in my css on y work in Codepen.