Hi guys,

i'm adding and removing <li> elements with jQuery, that are shown horizontally with the following style:

#my_ul {
    list-style: none;
}
#my_ul li {
    float: left;
    margin: 0px 15px;
}

For example, if i add four <li> to an <ul> and then i decide to remove the second one, after it has been removed the other two <li> elements on the right immediately move to the left.

What i'd like to do is to animate this behaviour, with the remaining <li> elements that softly moves to the left.

Any tips?

Thanks