CSS drop down menu hover not working

Question

Я создаю простое выпадающее меню и не могу понять, почему он не раскрывает себя при наведении. Я могу скрыть его, поэтому я знаю, что я нацелен на правильный код, но он ничего не делает на паре. Вот мой код:

<nav class="fluid nav"><ul> 
    <li><a href="about.html">about</a></li> 
    <li><a href="menu.html">menu</a> 
     <ul class="subnav"> 
      <li><a href="#">Pris Fix</a></li> 
      <li><a href="#">Dinner</a></li> 
      <li><a href="#">Wine List</a></li> 
     </ul> 
    </li> 
    <li><a href="reviews.html">reviews </a></li> 
    <li><a href="#contact.html">contact</a></li> 

CSS:

.nav 
{ display:block; 
padding: 2em 0 2em 0; 
color: #676027; 
font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif; 
font-style: normal; 
font-weight: 300; 
font-size: small; 
text-transform: uppercase; 
} 
.nav ul{ 
margin: 0; 
padding: 0; 
list-style-type: none; 
text-align: center; 
} 
.nav ul li{ 
display:inline; 
padding: 0 2em 0 2em; 
letter-spacing: 0.2em; 
} 
.nav ul li a{ 
text-decoration: none; 
text-transform:uppercase; 
padding: .2em 1em; 
color: #696229; 
} 

.nav ul li a:hover, .nav ul li a:active, .nav ul li a:focus 
{color: #000;} 

.nav ul li .subnav{display:none;} 
.nav ul li .subnav li a{font-size: x-small;} 
.nav ul li:hover ul .subnav{display:block; position:absolute;} 
.nav ul li:hover ul .subnav a{display:block; width: 80px;} 

Спасибо заранее.

Answer 1

Положение вы можете дать на .nav, или вы можете увидеть ссылки здесь http://line25.com/tutorials/how-to-create-a-pure-css-dropdown-menu

Answer 2

То, что вы сделали это

.nav ul li:hover ul .subnav{display:block; position:absolute;} 
.nav ul li:hover ul .subnav a{display:block; width: 80px;} 

ul .subnav должен быть присоединен к Афоризм или же вы Поиск ребенка .subnavul.

Так что измените ul .subnav на ul.subnav. Нет промежутка между ними.