diff --git a/packages/compass-crud/src/components/delete-data-menu.tsx b/packages/compass-crud/src/components/delete-data-menu.tsx
index b117a4779d9..a0776181120 100644
--- a/packages/compass-crud/src/components/delete-data-menu.tsx
+++ b/packages/compass-crud/src/components/delete-data-menu.tsx
@@ -1,5 +1,11 @@
 import React from 'react';
-import { Icon, Button, Tooltip } from '@mongodb-js/compass-components';
+import {
+  Icon,
+  Button,
+  Tooltip,
+  WorkspaceContainer,
+  css,
+} from '@mongodb-js/compass-components';
 import { usePreference } from 'compass-preferences-model/provider';
 
 type DeleteMenuButtonProps = {
@@ -7,6 +13,13 @@ type DeleteMenuButtonProps = {
   onClick: () => void;
 };
 
+const hiddenOnNarrowStyles = css({
+  [`@container ${WorkspaceContainer.toolbarContainerQueryName} (width < 900px)`]:
+    {
+      display: 'none',
+    },
+});
+
 const DeleteMenuButton: React.FunctionComponent<DeleteMenuButtonProps> = ({
   isWritable,
   onClick,
@@ -26,7 +39,7 @@ const DeleteMenuButton: React.FunctionComponent<DeleteMenuButtonProps> = ({
       leftGlyph={<Icon glyph="Trash"></Icon>}
       data-testid="crud-bulk-delete"
     >
-      Delete
+      <span className={hiddenOnNarrowStyles}>Delete</span>
     </Button>
   );
 };
diff --git a/packages/compass-crud/src/components/update-data-menu.tsx b/packages/compass-crud/src/components/update-data-menu.tsx
index 5180bcb5347..d2f7eaf4478 100644
--- a/packages/compass-crud/src/components/update-data-menu.tsx
+++ b/packages/compass-crud/src/components/update-data-menu.tsx
@@ -1,5 +1,11 @@
 import React from 'react';
-import { Icon, Button, Tooltip } from '@mongodb-js/compass-components';
+import {
+  Icon,
+  Button,
+  Tooltip,
+  css,
+  WorkspaceContainer,
+} from '@mongodb-js/compass-components';
 import { usePreference } from 'compass-preferences-model/provider';
 
 type UpdateMenuButtonProps = {
@@ -7,6 +13,13 @@ type UpdateMenuButtonProps = {
   onClick: () => void;
 };
 
+const hiddenOnNarrowStyles = css({
+  [`@container ${WorkspaceContainer.toolbarContainerQueryName} (width < 900px)`]:
+    {
+      display: 'none',
+    },
+});
+
 const UpdateMenuButton: React.FunctionComponent<UpdateMenuButtonProps> = ({
   isWritable,
   onClick,
@@ -26,7 +39,7 @@ const UpdateMenuButton: React.FunctionComponent<UpdateMenuButtonProps> = ({
       leftGlyph={<Icon glyph="Edit"></Icon>}
       data-testid="crud-update"
     >
-      Update
+      <span className={hiddenOnNarrowStyles}>Update</span>
     </Button>
   );
 };