diff --git a/change/@fluentui-react-tree-e43c53f4-8d36-486e-a2df-4a0f3da1c4d1.json b/change/@fluentui-react-tree-e43c53f4-8d36-486e-a2df-4a0f3da1c4d1.json
new file mode 100644
index 0000000000000..72657227bbb86
--- /dev/null
+++ b/change/@fluentui-react-tree-e43c53f4-8d36-486e-a2df-4a0f3da1c4d1.json
@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "bugfix: fix horizontal overflow on tree",
+  "packageName": "@fluentui/react-tree",
+  "email": "bernardo.sunderhus@gmail.com",
+  "dependentChangeType": "patch"
+}
diff --git a/packages/react-components/react-tree/src/components/TreeItem/useTreeItemStyles.styles.ts b/packages/react-components/react-tree/src/components/TreeItem/useTreeItemStyles.styles.ts
index fe551a206c235..621947c2e61fe 100644
--- a/packages/react-components/react-tree/src/components/TreeItem/useTreeItemStyles.styles.ts
+++ b/packages/react-components/react-tree/src/components/TreeItem/useTreeItemStyles.styles.ts
@@ -23,8 +23,9 @@ const useRootStyles = makeStyles({
     position: 'relative',
     cursor: 'pointer',
     display: 'grid',
+    boxSizing: 'border-box',
     gridTemplateRows: 'auto auto',
-    gridTemplateColumns: 'auto min-content',
+    gridTemplateColumns: 'minmax(0, 100%) minmax(0px, min-content)',
     gridTemplateAreas: `
     "layout  aside"
     "subtree subtree"
diff --git a/packages/react-components/react-tree/src/components/TreeItemLayout/useTreeItemLayoutStyles.styles.ts b/packages/react-components/react-tree/src/components/TreeItemLayout/useTreeItemLayoutStyles.styles.ts
index b73d25cc1ddbd..d72bfd2b24982 100644
--- a/packages/react-components/react-tree/src/components/TreeItemLayout/useTreeItemLayoutStyles.styles.ts
+++ b/packages/react-components/react-tree/src/components/TreeItemLayout/useTreeItemLayoutStyles.styles.ts
@@ -21,6 +21,8 @@ const useRootStyles = makeStyles({
     display: 'flex',
     alignItems: 'center',
     minHeight: '32px',
+    boxSizing: 'border-box',
+    ...shorthands.gridArea('layout'),
     ...shorthands.borderRadius(tokens.borderRadiusMedium),
     ':active': {
       color: tokens.colorNeutralForeground2Pressed,