Hardist
Hardist

Reputation: 1983

Javascript Onclick Menu

I used this demo:

Drop down menu with on click toggle

To make this:

http://jsfiddle.net/q0m4mk5o/

The only thing I need, is to make sure the submenu, is also being displayed horizontally. But I do not have enough understanding of CSS to make it work. Also, I am creating this for learning purposes.

I think it may have something to do with this bit:

.testul li ul {
display: none;
list-style: none;
position: absolute;
left: 0;
}
.testul li ul li {
list-style: none;
white-space: nowrap;
height: 24px;
line-height: 24px;
background: -webkit-linear-gradient(#c8bfb0, #f5efe6);
border-bottom: 1px solid #d3c7b6;
}

Upvotes: 0

Views: 97

Answers (1)

michelem
michelem

Reputation: 14590

Just add display: inline-block as:

JSFiddle

.testul li ul li {
    display: inline-block;
    list-style: none;
    white-space: nowrap;
    height: 24px;
    line-height: 24px;
    background: -webkit-linear-gradient(#c8bfb0, #f5efe6);
    border-bottom: 1px solid #d3c7b6;
}

Upvotes: 1

Related Questions