Get dropdown aligned with nav bar

Description

Demo Code

<html lang="en">
 <head> 
  <title>Lorem</title> 
  <style>
#navigation {<!--  ww  w  .  j a  va  2s  .co m-->
   float:left;
   width:100%;
   height:auto;
   color:Chartreuse;
   background:black;
   margin:0 auto;
   border-top:3px solid yellow;
   border-bottom:3px solid blue;
   -webkit-border-top-left-radius:11px;
   -webkit-border-top-right-radius:11px;
   -moz-border-radius-topleft:11px;
   -moz-border-radius-topright:11px;
}

#nav ul {
   margin:0 auto;
   font-family:"Arial";
   font-weight:100;
   padding:11px 46px 11px 11px;
   text-align:center;
}

#nav ul li {
   display:inline-block;
   margin:21px 0 0 21px;
   text-decoration:none;
   font-size:19px;
   border:hidden;
   color:pink;
   margin:0;
}

li a,
.dropbtn {
   display:inline-block;
   color:OrangeRed;
   text-align:center;
   padding:15px 17px;
   text-decoration:none;
}

li a:hover,
.dropdown:hover .dropbtn {
   background-color:grey;
   color:BlueViolet;
}

li.dropdown {
   display:inline-block;
}

.dropdown-content {
   display:none;
   position:absolute;
   background-color:Chartreuse;
   min-width:161px;
   box-shadow:0px 9px 17px 0px yellow;
}

.dropdown-content a {
   color:blue;
   padding:13px 17px;
   text-decoration:none;
   display:block;
   text-align:left;
}

.dropdown-content a:hover {
   background-color:pink;
}

.dropdown:hover .dropdown-content {
   display:block;
}
</style> 
 </head> 
 <body translate="no"> 
  <div id="navigation"> 
   <div id="nav"> 
    <ul> 
     <li> <a href="#OurClubTitle">Lorem ips</a> </li> 
     <li> <a href="#OurTeamsTitle">Lorem ips</a> </li> 
     <li> <a href="#penaltyTitle">Lorem ipsum dol</a> </li> 
     <li class="dropdown"> <a href="#contactUsTitle" class="dropbtn">Lorem ipsu</a> 
      <div class="dropdown-content"> 
       <a href="#trainingTitle">Lorem ipsum dol</a> 
      </div> </li> 
     <li> <a href="#extraSpecialTitle">Lorem ipsum d</a> </li> 
    </ul> 
   </div> 
  </div>  
 </body>
</html>
Get dropdown aligned with nav bar - HTML CSS CSS Widget

Description

Demo Code

Related Tutorials
