fix(react): Left-aligning menu items in Pivot's overflow menu (#33325)

khmakoto · Humberto Makoto Morimoto Burgos · web-flow · commit b1d0ddd4c97b · 2024-11-21T16:52:53.000-08:00
Co-authored-by: Humberto Makoto Morimoto Burgos &lt;makotom@microsoft.com&gt;
diff --git a/change/@fluentui-react-61cfae8a-355e-4814-bf2d-073d07f4d67e.json b/change/@fluentui-react-61cfae8a-355e-4814-bf2d-073d07f4d67e.json
@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "fix: Left-aligning menu items in Pivot's overflow menu.",
+  "packageName": "@fluentui/react",
+  "email": "makotom@microsoft.com",
+  "dependentChangeType": "patch"
+}
diff --git a/packages/react/src/components/Pivot/Pivot.styles.ts b/packages/react/src/components/Pivot/Pivot.styles.ts
@@ -224,10 +224,10 @@ export const getStyles = (props: IPivotStyleProps): IPivotStyles => {
       classNames.linkInMenu,
       ...getLinkStyles(props, classNames, true),
       {
-        textAlign: 'left',
-        width: '100%',
+        justifyContent: 'start',
         height: 36,
         lineHeight: 36,
+        width: '100%',
       },
     ],
     linkIsSelected: [
