[web-components] Fix tab panel display (#19731)

* fix tab panel display * Change files Co-authored-by: Cory LaViska <corylaviska@microsoft.com>
microsoft · Sep 9, 2021 · 1faed19 · 1faed19
1 parent 47c570f
commit 1faed19
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 1 deletion.
diff --git a/change/@fluentui-web-components-39a73505-6dd7-40b6-986f-ac3e9a0a9107.json b/change/@fluentui-web-components-39a73505-6dd7-40b6-986f-ac3e9a0a9107.json
@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "fix tab panel display",
+  "packageName": "@fluentui/web-components",
+  "email": "corylaviska@microsoft.com",
+  "dependentChangeType": "patch"
+}
diff --git a/packages/web-components/src/tabs/tab-panel/tab-panel.styles.ts b/packages/web-components/src/tabs/tab-panel/tab-panel.styles.ts
@@ -6,7 +6,7 @@ export const tabPanelStyles: (
   context: ElementDefinitionContext,
   definition: FoundationElementDefinition,
 ) => ElementStyles = (context: ElementDefinitionContext, definition: FoundationElementDefinition) => css`
-  ${display('flex')} :host {
+  ${display('block')} :host {
     box-sizing: border-box;
     font-family: ${bodyFont};
     font-size: ${typeRampMinus1FontSize};