JQuery Bounce In Place

Question

I need elements in the list of elements to bounce in place and not fall on each other.

I created a JSFiddle, which I mean: http://jsfiddle.net/RGvjj/

Can someone advise me why the elements do this and what I need to do to fix this?

Answer 1

Try removing the inlinedisplay from <li>and use instead float:left.

Try: http://jsfiddle.net/RGvjj/1/

#navigation li {
    font-size: 20px;
    margin-left: 10px;
    padding-left: 10px;
    border-left: 3px solid #1161A5;
    color: #ffffdd;
    text-decoration: none;
    float:left;
}

---

EDIT: , , , , jQuery display block. , block (<a>) inline (<li>), .

float:left, <li> block , <a> block.