Align for horizontal tabs: start
Tab label 1
Tab panel 1
Tab label 2
Tab panel 2
Tab label 3
Tab panel 3
Align for horizontal tabs: center
Tab label 1
Tab panel 1
Tab label 2
Tab panel 2
Tab label 3
Tab panel 3
Align for horizontal tabs: end
Tab label 1
Tab panel 1
Tab label 2
Tab panel 2
Tab label 3
Tab panel 3
Align for vertical tabs. When using vertical tabs, align of center or end make sens only when your tabs total height is larger than content height or content height is larger than total tabs height.
Please note that when individual tab contents are not the same height it will cause bad user experience when changing tabs. It's recomended to have default - align: 'start' when vertical tabs are used, or be sure that all of your tab content is the same height. Align for vertical tabs when: start. Tabs content height is not the same - please avoid.
Tab label 1
Column 1 Column 2 Column 3
Row 1 R1C1 R1C2 R1C3
Row 2 R2C1 R2C2 R2C3
Row 3 R3C1 R3C2 R3C3
Footer FC1 FC2 FC3
Tab label 2
Tab label 3
Mountains
Align for vertical tabs when: center. Tabs content height is not the same - please avoid.
Tab label 1
Column 1 Column 2 Column 3
Row 1 R1C1 R1C2 R1C3
Row 2 R2C1 R2C2 R2C3
Row 3 R3C1 R3C2 R3C3
Footer FC1 FC2 FC3
Tab label 2
Tab label 3
Mountains
Align for vertical tabs when: end. Tabs content height is not the same - please avoid.
Tab label 1
Column 1 Column 2 Column 3
Row 1 R1C1 R1C2 R1C3
Row 2 R2C1 R2C2 R2C3
Row 3 R3C1 R3C2 R3C3
Footer FC1 FC2 FC3
Tab label 2
Tab label 3
Mountains
Align for vertical tabs: start. Tabs content height is the same height.
Tab label 1
Tab panel 1
Tab label 2
Tab panel 2
Tab label 3
Tab panel 3
Tab label 4
Tab panel 4
Tab label 5
Tab panel 5
Tab label 6
Tab panel 6
Align for vertical tabs: center. Tabs content height is the same height.
Tab label 1
Tab panel 1
Tab label 2
Tab panel 2
Tab label 3
Tab panel 3
Tab label 4
Tab panel 4
Tab label 5
Tab panel 5
Tab label 6
Tab panel 6
Align for vertical tabs: end. Tabs content height is the same height.
Tab label 1
Tab panel 1
Tab label 2
Tab panel 2
Tab label 3
Tab panel 3
Tab label 4
Tab panel 4
Tab label 5
Tab panel 5
Tab label 6
Tab panel 6