css - Sub-menu will not stack vertically -


i trying vertically stack sub-menu, however, having trouble getting stack possibly due of parent styling. goal sub-menu stack vertically underneath first link. advice?

jsfiddle

css

nav {     height: 70px;     background: transparent;   }   nav ul {     display: inline-block;     list-style: none;     height: 70px;     float:right;   }   nav ul li {     display: inline-block;     background: transparent;     float: left;     padding: 0px 10px;     padding-top: 23px;     height: 43px;     border-top: 4px solid $white;   }   nav ul li:first-child {     border-top: 4px solid $white;   }    nav ul li {     font-family: 'lato', serif;     font-size: 14px;     color: $textcolor;     line-height: 122%;     letter-spacing: 1.5px;     padding-left: 0;   }    nav ul ul {     display: block;   }   nav ul ul li {     display: block;   }   nav ul ul li {     display: block;   } 

man, need learn doing. quite effort correct code. start, seem unaware of fact that

nav ul { ... } 

will not affect outer <ul>, inner <ul id="submenu">.

the fact use id="submenu" suggests next thing might unaware of per html document, given id value must unique, can used on one element.

https://jsfiddle.net/gmtugks5/2/


Comments

Popular posts from this blog

javascript - Bootstrap Popover: iOS Safari strange behaviour -

Magento/PHP - Get phones on all members in a customer group -

session - Logging Out Using PHP -