put show more button inside resizer

this way we have a flexbox layout in the resizer with:
 - the resize handle (fixed)
 - the show more/less button, if any (fixed)
 - the list of tiles (grabbing whatever is left)

res/css/views/rooms/_RoomSublist2.scss

@@ -186,12 +186,22 @@ limitations under the License.
         flex-direction: column;
         overflow: hidden;
 
+        .mx_RoomSublist2_tiles {
+            flex: 1 0 0;
+            overflow: hidden;
+            // need this to be flex otherwise the overflow hidden from above
+            // sometimes vertically centers the clipped list ... no idea why it would do this
+            // as the box model should be top aligned. Happens in both FF and Chromium
+            display: flex;
+            flex-direction: column;
+        }
+
         .mx_RoomSublist2_resizerHandles_showNButton {
-            position: absolute;
+            flex: 0 0 32px;
-            bottom: -32px; // height of the button
+        }
-            left: 0;
+
-            right: 0;
+        .mx_RoomSublist2_resizerHandles {
-            height: 4px; // height of the handle
+            flex: 0 0 4px;
         }
 
         // Class name comes from the ResizableBox component

src/components/views/rooms/RoomSublist2.tsx

@@ -666,9 +666,11 @@ export default class RoomSublist2 extends React.Component<IProps, IState> {
                         className="mx_RoomSublist2_resizeBox"
                         enable={handles}
                     >
-                        {visibleTiles}
+                        <div className="mx_RoomSublist2_tiles">
+                            {visibleTiles}
+                        </div>
+                        {showNButton}
                     </Resizable>
-                    {showNButton}
                 </React.Fragment>
             );
         }