FireFox, multiple rows: Difference between revisions
From Andreida
(Created page with "* in profile folder (Firefox: Help/Troubleshooting Information/Profile Folder/Open) * create folder chrome, then inside of it * create userChrome.css with the content below *...") |
No edit summary |
||
| Line 3: | Line 3: | ||
* create userChrome.css with the content below |
* create userChrome.css with the content below |
||
* restart firefox |
* restart firefox |
||
<nowiki> |
|||
/* |
|||
The class .tabbrowser-tabs has been replaced with id #tabbrowser-tabs |
|||
changed selectors accordingly |
|||
*/ |
|||
.tabbrowser-tab:not([pinned]) { |
|||
flex-grow:1; |
|||
min-width:100px !important; /* Needed important tag, width can be whatever you like */ |
|||
max-width: none !important; /* Makes the tabs always fill the toolbar width */ |
|||
} |
|||
.tabbrowser-tab,.tab-background { |
|||
height:var(--tab-min-height); |
|||
} |
|||
.tab-stack { |
|||
width: 100%; |
|||
} |
|||
#tabbrowser-tabs .scrollbox-innerbox { |
|||
display: flex; |
|||
flex-wrap: wrap; |
|||
} |
|||
#tabbrowser-tabs .arrowscrollbox-scrollbox { |
|||
overflow: visible; |
|||
display: block; |
|||
} |
|||
#titlebar,#titlebar-buttonbox{ |
|||
height:var(--tab-min-height) !important; |
|||
} |
|||
#titlebar{ |
|||
margin-bottom:calc(var(--tab-min-height)*-1) !important; |
|||
} |
|||
#main-window[sizemode="maximized"] #titlebar{ |
|||
margin-bottom:calc(6px + var(--tab-min-height)*-1) !important; |
|||
} |
|||
#main-window[sizemode="maximized"] #TabsToolbar{ |
|||
margin-left:var(--tab-min-height); |
|||
} |
|||
#titlebar:active{ |
|||
margin-bottom:0 !important; |
|||
} |
|||
#titlebar:active #titlebar-content{ |
|||
margin-bottom:var(--tab-min-height) !important; |
|||
} |
|||
#tabbrowser-tabs .scrollbutton-up,#tabbrowser-tabs .scrollbutton-down,#alltabs-button,.tabbrowser-tab:not([fadein]){ |
|||
display: none; |
|||
} |
|||
/* This enables maximum width before scrollbar is shown */ |
|||
#main-window[tabsintitlebar] #tabbrowser-tabs { |
|||
-moz-window-dragging: no-drag; |
|||
} |
|||
#tabbrowser-tabs .scrollbox-innerbox { |
|||
max-height: 100px; |
|||
overflow-y:auto; |
|||
} |
|||
</nowiki> |
|||
Revision as of 14:01, 14 January 2018
- in profile folder (Firefox: Help/Troubleshooting Information/Profile Folder/Open)
- create folder chrome, then inside of it
- create userChrome.css with the content below
- restart firefox
/*
The class .tabbrowser-tabs has been replaced with id #tabbrowser-tabs
changed selectors accordingly
*/
.tabbrowser-tab:not([pinned]) {
flex-grow:1;
min-width:100px !important; /* Needed important tag, width can be whatever you like */
max-width: none !important; /* Makes the tabs always fill the toolbar width */
}
.tabbrowser-tab,.tab-background {
height:var(--tab-min-height);
}
.tab-stack {
width: 100%;
}
#tabbrowser-tabs .scrollbox-innerbox {
display: flex;
flex-wrap: wrap;
}
#tabbrowser-tabs .arrowscrollbox-scrollbox {
overflow: visible;
display: block;
}
#titlebar,#titlebar-buttonbox{
height:var(--tab-min-height) !important;
}
#titlebar{
margin-bottom:calc(var(--tab-min-height)*-1) !important;
}
#main-window[sizemode="maximized"] #titlebar{
margin-bottom:calc(6px + var(--tab-min-height)*-1) !important;
}
#main-window[sizemode="maximized"] #TabsToolbar{
margin-left:var(--tab-min-height);
}
#titlebar:active{
margin-bottom:0 !important;
}
#titlebar:active #titlebar-content{
margin-bottom:var(--tab-min-height) !important;
}
#tabbrowser-tabs .scrollbutton-up,#tabbrowser-tabs .scrollbutton-down,#alltabs-button,.tabbrowser-tab:not([fadein]){
display: none;
}
/* This enables maximum width before scrollbar is shown */
#main-window[tabsintitlebar] #tabbrowser-tabs {
-moz-window-dragging: no-drag;
}
#tabbrowser-tabs .scrollbox-innerbox {
max-height: 100px;
overflow-y:auto;
}