diff --git a/pages/admin.vue b/pages/admin.vue
index 34d8b0567..7149109b1 100644
--- a/pages/admin.vue
+++ b/pages/admin.vue
@@ -4,13 +4,13 @@
       {{ $t('admin.name') }}
     </ds-heading>
     <ds-flex gutter="small">
-      <ds-flex-item :width="{ base: '200px' }">
+      <ds-flex-item :width="{ base: '100%', md: '200px' }">
         <ds-menu
           :routes="routes"
           :is-exact="() => true"
         />
       </ds-flex-item>
-      <ds-flex-item>
+      <ds-flex-item :width="{ base: '100%', md: 1 }">
         <transition
           name="slide-up"
           appear
diff --git a/pages/moderation.vue b/pages/moderation.vue
index 0e0660309..6b151b0e4 100644
--- a/pages/moderation.vue
+++ b/pages/moderation.vue
@@ -4,10 +4,10 @@
       {{ $t('moderation.name') }}
     </ds-heading>
     <ds-flex gutter="small">
-      <ds-flex-item :width="{ base: '200px' }">
+      <ds-flex-item :width="{ base: '100%', md: '200px' }">
         <ds-menu :routes="routes" />
       </ds-flex-item>
-      <ds-flex-item>
+      <ds-flex-item :width="{ base: '100%', md: 1 }">
         <transition
           name="slide-up"
           appear
diff --git a/pages/settings.vue b/pages/settings.vue
index e302cba44..9e2d63056 100644
--- a/pages/settings.vue
+++ b/pages/settings.vue
@@ -4,13 +4,13 @@
       {{ $t('settings.name') }}
     </ds-heading>
     <ds-flex gutter="small">
-      <ds-flex-item :width="{ base: '200px' }">
+      <ds-flex-item :width="{ base: '100%', md: '200px' }">
         <ds-menu
           :routes="routes"
           :is-exact="() => true"
         />
       </ds-flex-item>
-      <ds-flex-item>
+      <ds-flex-item :width="{ base: '100%', md: 1 }">
         <transition
           name="slide-up"
           appear