diff --git a/tank-frontend/src/MapChooser.css b/tank-frontend/src/MapChooser.css
index 9bd5c79..600c01b 100644
--- a/tank-frontend/src/MapChooser.css
+++ b/tank-frontend/src/MapChooser.css
@@ -1,15 +1,8 @@
 
-.MapChooser-DropDown {
-    border: solid var(--border-size-thin);
-    padding: var(--padding-normal);
-
-    background: var(--color-background);
-    border-color: var(--color-primary);
-    color: var(--color-primary);
-}
-
 .MapChooser-Row {
-    flex-wrap: wrap;
+    display: grid;
+    width: 100%;
+    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
 }
 
 .MapChooser-Preview {
@@ -21,3 +14,7 @@
 .MapChooser-Preview-Highlight {
     border-color: var(--color-secondary);
 }
+
+.MapChooser-Dialog {
+    width: 100%;
+}
diff --git a/tank-frontend/src/MapChooser.tsx b/tank-frontend/src/MapChooser.tsx
index 3725d2f..1012539 100644
--- a/tank-frontend/src/MapChooser.tsx
+++ b/tank-frontend/src/MapChooser.tsx
@@ -58,7 +58,11 @@ function MapChooserDialog({mapNames, onClose, onConfirm}: {
     readonly onClose: () => void;
 }) {
     const [chosenMap, setChosenMap] = useState<string>();
-    return <Dialog title="Choose a map" onClose={onClose}>
+    return <Dialog
+        className='MapChooser-Dialog'
+        title="Choose a map"
+        onClose={onClose}
+    >
         <Row className="MapChooser-Row overflow-scroll">
             {mapNames.map(name => <MapPreview
                 key={name}