FireFox, multiple rows

From Andreida

seems to make problems since 2019-02-05



  • 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;
}

source: while trying this out I had to restart firefox. It worked. But I don't have the googled forum entry any more. Sorry.