Pages

Sunday, August 29, 2021

Office Ui Fabric Pivot control Overflow issue in SPFx

Problem

office-ui-fabric-react is recommended to use with SharePoint Framework. 

https://docs.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/get-started/use-fabric-react-components

With the Office UI Fabric React there is a overflow issue in Pivot. The overflow doesn't work as expected. 



Solution
  • Install @fluentui/react-tabs 
    • npm -i @fluentui/react-tabs
  • Import the package to your React component 
    • import { Pivot, PivotItem } from '@fluentui/react-tabs';
  • Add overflow code to the Pivot 
    • overflowBehavior="menu"

Conclusion 





No comments:

Post a Comment