Fix alignment bug with space panel on spaces with subspaces in Chrome

Author: t3chguy

res/css/structures/_SpacePanel.scss

@@ -146,9 +146,6 @@ $activeBorderColor: $secondary-fg-color;
 
         .mx_SpaceButton_toggleCollapse {
             width: $gutterSize;
-            // negative margin to place it correctly even with the complex
-            // 4px selection border each space button has when active
-            margin-right: -4px;
             height: 20px;
             mask-position: center;
             mask-size: 20px;

src/components/views/spaces/SpaceTreeLevel.tsx

@@ -37,7 +37,7 @@ import {
     showSpaceSettings,
 } from "../../../utils/space";
 import MatrixClientContext from "../../../contexts/MatrixClientContext";
-import {ButtonEvent} from "../elements/AccessibleButton";
+import AccessibleButton, {ButtonEvent} from "../elements/AccessibleButton";
 import defaultDispatcher from "../../../dispatcher/dispatcher";
 import Modal from "../../../Modal";
 import SpacePublicShare from "./SpacePublicShare";
@@ -353,7 +353,7 @@ export class SpaceItem extends React.PureComponent<IItemProps, IItemState> {
         const avatarSize = isNested ? 24 : 32;
 
         const toggleCollapseButton = childSpaces && childSpaces.length ?
-            <button
+            <AccessibleButton
                 className="mx_SpaceButton_toggleCollapse"
                 onClick={evt => this.toggleCollapse(evt)}
             /> : null;