The menu we will be creating features two sub categories .

nav ul {  background: #efefef;   background: linear-gradient(top, #efefef 0%, #bbbbbb 100%);    background: -moz-linear-gradient(top, #efefef 0%, #bbbbbb 100%);   background: -webkit-linear-gradient(top, #efefef 0%,#bbbbbb 100%);   box-shadow: 0px 0px 9px rgba(0,0,0,0.15);  padding: 0 20px;  border-radius: 10px;    list-style: none;  position: relative;  display: inline-table; }  

nav ul:after {   content: ""; clear: both; display: block;  } 

nav ul li {  float: left; }  

nav ul li:hover {   background: #4b545f;   background: linear-gradient(top, #4f5964 0%, #5f6975 40%);   background: -moz-linear-gradient(top, #4f5964 0%, #5f6975 40%);   background: -webkit-linear-gradient(top, #4f5964 0%,#5f6975 40%);  }   

nav ul li:hover a {    color: #fff;   }    

nav ul li a {   display: block; padding: 25px 40px;   color: #757575; text-decoration: none;  } 

nav ul ul {  background: #5f6975; border-radius: 0px; padding: 0;  position: absolute; top: 100%; }  

nav ul ul li {   float: none;    border-top: 1px solid #6b727c;   border-bottom: 1px solid #575f6a;   position: relative;  }

nav ul ul li a {    padding: 15px 40px;    color: #fff;   }    

nav ul ul li a:hover {     background: #4b545f;    }

nav ul ul {  display: none; } 
nav ul li:hover > ul {   display: block;  } 

nav ul ul ul {  position: absolute; left: 100%; top:0; }

About Raka Rocks

Hi, My self Raka Rocks. I am web designer and Front End Developer total 8 year exp. in this fields. I am a continuous blogger and has blogged on different topics. He loves to surf the Internet and always tries to get new ideas about new technologies and innovations and share this excellent information with all technology lovers.

Leave a Reply

Your email address will not be published.