diff --git a/src/components/views/rooms/RoomSublist2.tsx b/src/components/views/rooms/RoomSublist2.tsx
index f2e5329ab0..9c034ce749 100644
--- a/src/components/views/rooms/RoomSublist2.tsx
+++ b/src/components/views/rooms/RoomSublist2.tsx
@@ -77,7 +77,8 @@ export default class RoomSublist2 extends React.Component<IProps, IState> {
     };
 
     private onResize = (e: React.MouseEvent, data: ResizeCallbackData) => {
-        const tileDiff = e.movementY < 0 ? -1 : +1;
+        const direction = e.movementY < 0 ? -1 : +1;
+        const tileDiff = this.props.layout.pixelsToTiles(Math.abs(e.movementY)) * direction;
         this.props.layout.visibleTiles += tileDiff;
         this.forceUpdate(); // because the layout doesn't trigger a re-render
     };
@@ -254,7 +255,7 @@ export default class RoomSublist2 extends React.Component<IProps, IState> {
                     axis="y"
                     minConstraints={[-1, minTilesPx]}
                     maxConstraints={[-1, maxTilesPx]}
-                    draggableOpts={{grid: [-1, layout.tileHeight]}}
+                    draggableOpts={{grid: [-1, 1]}}
                     resizeHandles={handles}
                     onResize={this.onResize}
                     className="mx_RoomSublist2_resizeBox"
diff --git a/src/stores/room-list/ListLayout.ts b/src/stores/room-list/ListLayout.ts
index af6abe3297..fd57a03ca1 100644
--- a/src/stores/room-list/ListLayout.ts
+++ b/src/stores/room-list/ListLayout.ts
@@ -57,6 +57,10 @@ export class ListLayout {
         return n * this.tileHeight;
     }
 
+    public pixelsToTiles(px: number): number {
+        return px / this.tileHeight;
+    }
+
     private serialize(): ISerializedListLayout {
         return {
             numTiles: this.visibleTiles,