我的下拉菜单有问题

Question

所以我在创建下拉子菜单时遇到了麻烦。我已经开始给主要的 ul 一个 class 和第二个 ul 的一个 id 但在那之后我不知道我应该在哪里应用 CSS。我将 ul#sub1 和 li a:hover 显示都设置为阻止，这样您就可以准确地看到我想说的内容演示：

ul {
 list-style-type:none;
 margin:0;
 padding:0;
 background-color:#404040;
 overflow:hidden;
}

li {
 float:left;
}

li a {
 display:block;
 padding:15px;
 color:#8c8c8c;
 float:left;
 text-decoration:none;
 padding:30px;
 display:absolute;
 font-size:15px;
 letter-spacing:2px;
 
}

ul#sub1 {
 display:block;
 position:absolute;
 top:78px;
 left:410px;
}

li a:hover {
 background-color:#ff8533;
 color:white;
 transition:0.4s;
 display:block;
}

li a.active {
 background-color:#ff8533;
 color:white;
}

<ul class='navmenu'>
   <li><a href='http://www.google.ro'>HOME</a></li>
   <li><a class='active' href='http://www.google.ro'>ABOUT US</a></li>
   <li><a href='http://www.google.ro'>SERVICES</a></li>
   <li><a href='http://www.google.ro'>GALLERY</a></li>
    <ul id='sub1'>
     <li>
      <a href='http://www.google.ro'>GALLERY 2</a>
     </li>
     <li>
      <a href='http://www.google.ro'>GALLERY 3</a>
     </li>
     <li>
      <a href='http://www.google.ro'>GALLERY 4</a>
     </li>
    </ul>
   <li><a href='http://www.google.ro'>NEWS</a></li>
   <li><a href='http://www.google.ro'>CONTACTS</a></li>
  </ul>

Answer 1

ul {
   list-style-type:none;
 margin:0;
 padding:0;
 background-color:#404040;
  }

ul.navmenu {

  position:relative;
  display:inline-block;
  width:100%;
}

li {
 float:left;
  position:relative;
}

li a {
 display:block;
 padding:15px;
 color:#8c8c8c;
 float:left;
 text-decoration:none;
 padding:30px;
 display:absolute;
 font-size:15px;
 letter-spacing:2px;
 
}

ul.navmenu > li:hover a + ul {
display:block;
  }

ul.navmenu ul {
 display:none;
 position:absolute;
 top:100%; 
}

ul#sub1 li {
  display:block;
  float:none;
  }

li a:hover {
 background-color:#ff8533;
 color:white;
 transition:0.4s;
 display:block;
}

li a.active {
 background-color:#ff8533;
 color:white;
}

<ul class='navmenu'>
   <li><a href='http://www.google.ro'>HOME</a></li>
   <li><a class='active' href='http://www.google.ro'>ABOUT US</a></li>
   <li><a href='http://www.google.ro'>SERVICES</a></li>
   <li><a href='http://www.google.ro'>GALLERY</a>
    <ul id='sub1'>
     <li>
      <a href='http://www.google.ro'>GALLERY 2</a>
     </li>
     <li>
      <a href='http://www.google.ro'>GALLERY 3</a>
     </li>
     <li>
      <a href='http://www.google.ro'>GALLERY 4</a>
     </li>
    </ul>
             </li>
   <li><a href='http://www.google.ro'>NEWS</a></li>
   <li><a href='http://www.google.ro'>CONTACTS</a></li>
  </ul>

我的下拉菜单有问题

Having issues on my drop-down menu

html

css

submenu

dropdown