jQuery sortable connected-lists inline

I'm referring to this link here: sortable

I want to make these items inline, and I've changed the display of the

#sortable1 li, #sortable2 li  

to

display:inline;

in the css, but then all gets scrambled and my items fly off to the right, even though I have div wrapper set which is 500px - they fly out of that area.

Has anyone some good t开发者_运维问答ips to handle this?

Thank you.

Try changing your css to:

#sortable1, #sortable2 {
    margin: 0 10px 0 0;
    padding: 0;
}

#sortable1 li, #sortable2 li {
    display: inline;
    font-size: 1.2em;
    margin: 0 5px 5px;
    padding: 5px;
    width: 120px;
}