Skip to main content

Customize view and page tab width

Here Core 42+ includes settings to auto-resize your view tabs or page tabs. You can configure minimum and maximum width limits per tab type to ensure readability while optimizing layout. The auto-resizing tabs maintain equal width across tab types and automatically adjust width (wider or narrower) based on the minWidth and maxWidth values you set in your manifest file or code. This behavior mirrors the behavior found in Chrome.

When tabs exceed available space, users utilize horizontal scrolling with visual shadow indicators to signal hidden tabs, replacing the dropdown overflow menu currently used for view tabs. The horizontal scrollbar under page tabs is unchanged.

info

The close button (✕) remains visible and accessible on all tabs whether you use this feature or not, regardless of tab size.

This feature is optional, so you can choose whether to implement it. When pageTabDimensions or viewTabDimensions is not provided, the system defaults to set tab widths.

JavaScript object example


platform:{
defaultWindowOptions: {
workspacePlatform: {
// Configure page tab width
pageTabDimensions: {
minWidth: "30px",
maxWidth: "400px"
},
// Configure view tab width
viewTabDimensions: {
minWidth: "50px",
maxWidth: :"400px"
}
}
}
}

Platform manifest example


"platform": {
"defaultWindowOptions": {
"workspacePlatform": {
// Configure page tab width
"pageTabDimensions": {
"minWidth": "30px",
"maxWidth": "400px"
},
// Configure view tab width
"viewTabDimensions": {
"minWidth": "50px",
"maxWidth": "400px"
}
}
}
}