Edit in JSFiddle


              
<ul class="menu">
    <li class="parent"><a href="#">Parent</a>
    <ul>
        <li><a href="#">Child</a></li> 
        <li class="parent"><a href="#">Link</a>
            <ul>
                <li><a href="#">Grand Child</a></li> 
                <li class="parent"><a href="#">Link</a>
                    <ul>
                        <li><a href="#">Great Grand Child</a></li> 
                        <li><a href="#">Link</a></li>  
                        <li><a href="#">Link</a></li>   
                        <li class="parent"><a href="#">Link</a>
                            <ul>
                                <li><a href="#">Great Great Grand Child</a></li> 
                                <li><a href="#">Link</a></li>  
                                <li><a href="#">Link</a></li>   
                                <li class="parent"><a href="#">Link</a>
                                <ul>
                                    <li><a href="#">Great Great Great Grand Child</a></li> 
                                    <li><a href="#">Link</a></li>  
                                    <li><a href="#">Link</a></li>   
                                    <li><a href="#">Link</a></li> 
                                </ul>            
                                </li> 
                            </ul>
                        </li>                             
                    </ul>
                </li>  
                <li><a href="#">Link</a></li>   
                <li><a href="#">Link</a></li> 
            </ul>    
        </li>  
        <li><a href="#">Link</a></li>   
        <li><a href="#">Link</a></li>             
    </ul>            
    </li>  
    <li><a href="#">Link</a></li>  
    <li><a href="#">Link</a></li>  
    <li><a href="#">Link</a></li>  
</ul>
ul.menu {
    position: relative;
    margin-bottom:0;
    li {
        position: relative;
        float: left;
        zoom:1;
        list-style: none;
        a {
            display: block;
            padding:.382em 1em;
            background:#eee;  
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;    
            box-sizing: border-box;    
        }
        &.parent { // Styles applied to all parent list items
            > a:after {
                content:"\2193";
                line-height:1;
                margin-left:1em;
                float:right;
            }
        }
    }
    /* CHILDREN */
    ul {
        width:10em;
        visibility: hidden; // Optionally use display:none to avoid horizontal scrollbars
        position: absolute;
        top:100%;
        left: 0;
        z-index: 9999;
        margin:0;
        li {
            float: none;
            a {
                width: 100%;
                display: inline-block;
            }
            &.parent {
                > a:after {
                    content:"\2192";
                }
            }
        }            
    }
    ul ul {
        left:100%;
        top:0;
    }
    li:hover > ul {
        visibility: visible;
    }
}