diff --git a/src/components/ExtendedPageHeader/ExtendedPageHeader.tsx b/src/components/ExtendedPageHeader/ExtendedPageHeader.tsx
index 15589f4e7..8eabf42f7 100644
--- a/src/components/ExtendedPageHeader/ExtendedPageHeader.tsx
+++ b/src/components/ExtendedPageHeader/ExtendedPageHeader.tsx
@@ -11,7 +11,7 @@ const useStyles = makeStyles(
       }
     },
     block: {
-      [theme.breakpoints.down("sm")]: {
+      [theme.breakpoints.down("xs")]: {
         "&&": {
           display: "block"
         }
diff --git a/src/components/PageHeader/PageHeader.tsx b/src/components/PageHeader/PageHeader.tsx
index 87d0238fa..a54136ba3 100644
--- a/src/components/PageHeader/PageHeader.tsx
+++ b/src/components/PageHeader/PageHeader.tsx
@@ -14,7 +14,17 @@ const useStyles = makeStyles(
     },
     root: {
       alignItems: "center",
-      display: "flex"
+      display: "flex",
+      [theme.breakpoints.down("xs")]: {
+        flexDirection: "column",
+        alignItems: "flex-start",
+        "& > *": {
+          width: "100%"
+        },
+        "& > *:not(first-child)": {
+          marginTop: theme.spacing(2)
+        }
+      }
     },
     title: {
       [theme.breakpoints.down("sm")]: {
diff --git a/src/products/components/ProductListPage/ProductListPage.tsx b/src/products/components/ProductListPage/ProductListPage.tsx
index 082b6eb15..e10ac1c13 100644
--- a/src/products/components/ProductListPage/ProductListPage.tsx
+++ b/src/products/components/ProductListPage/ProductListPage.tsx
@@ -57,7 +57,12 @@ export interface ProductListPageProps
 const useStyles = makeStyles(
   theme => ({
     columnPicker: {
-      marginRight: theme.spacing(3)
+      marginRight: theme.spacing(3),
+      [theme.breakpoints.down("xs")]: {
+        "& > button": {
+          width: "100%"
+        }
+      }
     },
     settings: {
       marginRight: theme.spacing(2)