在我的下拉菜单上出现问题

Question

所以我面临着创建下拉子菜单的麻烦。我已经开始给主要的ul一个类和第二个ul的id但在那之后我不知道我应该在哪里应用CSS。   我设置了ul＃sub1＆amp; li a：将显示屏悬停在阻止状态，这样你就可以清楚地看到我想说的话   演示：

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

＆＃13;

＆＃13;

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;
}

＆＃13;

<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>

＆＃13;

＆＃13;

＆＃13;