Question

In this fiddle when user drags a div auto scroll works in chrome but not in IE ?

http://jsfiddle.net/adrianjsfiddlenetuser/FafWW/

<div style="display:inline-block">
<div id="List1">
        <div>Item1</div>
        <div>Item2</div>
        <div>Item3</div>
        <div>Item4</div>
        <div>Item5</div>
        <div>Item6</div>
        <div>Item7</div>
        <div>Item8</div>
        <div>Item9</div>
    </div>

    <div id="List2">
        <div>Item1</div>
        <div>Item2</div>
        <div>Item3</div>
        <div>Item4</div>
        <div>Item5</div>
        <div>Item6</div>
        <div>Item7</div>
        <div>Item8</div>
        <div>Item9</div>
    </div>
</div>
​
#List1, #List2
{
    height: 300px;
    width: 200px;
    overflow: auto;
    border: solid 2px black;
    margin-bottom: 20px;
    float:left;
    margin:10px;
}

#List1 > DIV, #List2 > DIV
{
    height: 50px;
    border: solid 1px red;
}​

$(function() {
    var sortlists = $("#List1, #List2").sortable({
        tolerance: 'pointer',
        connectWith: '#List1, #List2',
        helper: 'original',
        scroll: true
    });
});​

Answer 1

I believe this is a known bug in jquery-ui. As the bug notes suggest, try putting “position: relative” on the parent div and see if that fixes it in IE.