Horizontal Menu with Vertical Submenu (HTML/CSS Only)

Question

I\'m having a difficult time trying to make my submenu vertical instead of horizontal. Any help would be much appreciated.

HTML:

Answer 1

Just try this updated CSS.

ul#menu li:hover ul {
    display: block;
    position: absolute;
    top: 10x;
    width: 200px;
}

ul#menu {
    font-size: 1.3em;
    font-weight: 600;
    margin: 0 0 5px;
    padding: 0;
    text-align: left;
    position: relative
}

Below is a working Demo.
http://jsbin.com/buculimi/1/edit