edit_problems

by brigand

HTML

<span class="ddforms_user_edit">(edit)<ul class="ddforms_user_edit"><li>one<ul><li>three</li><li>four</li></ul></li><li>two</li></ul></span>

<br /><br />

<span class="ddforms_user_edit">(edit)<ul class="ddforms_user_edit"><li>one<ul><li>three</li><li>four</li></ul></li><li>two</li></ul></span>

CSS

span.ddforms_user_edit {
    cursor: pointer;
    opacity: .99;
    position: relative;
}

span.ddforms_user_edit:hover > ul {
  z-index: 2;
}

span.ddforms_user_edit:hover > ul {
    display: block;
}

ul.ddforms_user_edit {
    background: #e7e7e7;
    border: 2px solid #c0c0c0;
    display: none;
    left: 0;
    padding: 0;
    position: absolute;
    top: 0;
}

ul.ddforms_user_edit > li {
    list-style-type: none;
    margin: 0;
    padding: 10px 0;
    text-align: center;
    width: 150px;
}

ul.ddforms_user_edit li:hover {
    background: #e7e7e7;
}

ul.ddforms_user_edit > li ul {
    background: #e7e7e7;
    display: none;
    left: 150px;
    padding: 0;
    position: absolute;
    top: 0;
}

ul.ddforms_user_edit > li:hover ul {
    display: block;
    width: 200px;
}

ul.ddforms_user_edit > li ul li {
    list-style-type: none;
    margin: 0;
    padding: 10px 0;
    text-align: center;
    width: 200px;
}

ul.ddforms_user_edit > li ul li:hover {
    background: #d6d6d6;
}