Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Tabs are now on bottom, nope, no good I have tabs CSS code, now is not functioning. Only see one tab at a time

  • No replies
  • 1 has this problem
  • 15 views
more options

I had CSS code to put my tabs under the bookmark toolbar. Now after the update I get only one tab on the bottom and I want them back on top. All of them. What do I change? Here's the code. /* Firefox Quantum userChrome.css tweaks ************************************************/ /* Github: https://github.com/aris-t2/customcssforfx ************************************/ /* THIS EXTRACT combines three files from the above repository:

  https://github.com/Aris-t2/CustomCSSforFx/blob/master/classic/css/tabs/tabs_below_navigation_toolbar.css
  version 2.6.8 as of Aug. 30, 2019
  https://github.com/Aris-t2/CustomCSSforFx/blob/master/classic/css/tabs/tabs_below_navigation_toolbar_fx65.css
  version 2.7.5 as of Sept. 30, 2019
  https://github.com/Aris-t2/CustomCSSforFx/blob/master/classic/css/tabs/tabs_below_navigation_toolbar_fx68.css
  version 2.7.1 as of Sept. 4, 2019
  • /

/****************************************************************************************/

root {
 --colored_menubar_background_image: linear-gradient(#f9f9fa,#f9f9fa);
 --general_toolbar_color_toolbars: linear-gradient(#f9f9fa,#f9f9fa);
 --general_toolbar_color_navbar: linear-gradient(#f9f9fa,#f9f9fa);
 --tabs_toolbar_color_tabs_not_on_top: linear-gradient(#f9f9fa,#f9f9fa);
 --tabs_toolbar_border-tnot_normal_mode_size: 3px;
 --tabs_toolbar_border-tnot_normal_mode: var(--tabs-border-color);
 --classic_squared_tabs_tab_text_color: black;
 --classic_squared_tabs_new_tab_icon_color: black;
 --classic_squared_tabs_tab_text_shadow: transparent;
 --tab-min-height_tnot: 28px;

}

root[uidensity=compact] {
 --tab-min-height_tnot: 28px;

}

root[uidensity=touch] {
 --tab-min-height_tnot: 28px;

}

/* tabs toolbar adjustment */

  1. main-window[tabsintitlebar] #toolbar-menubar[autohide="false"][inactive="false"] ~ #TabsToolbar,
  2. main-window[tabsintitlebar][sizemode="maximized"] #toolbar-menubar[autohide="false"][inactive="false"] ~ #TabsToolbar,
  3. main-window[uidensity=compact][tabsintitlebar] #toolbar-menubar[autohide="false"][inactive="false"] ~ #TabsToolbar,
  4. main-window[uidensity=compact][tabsintitlebar][sizemode="maximized"] #toolbar-menubar[autohide="false"][inactive="false"] ~ #TabsToolbar,
  5. TabsToolbar {
 -moz-padding-start: 2px !important;

}

  1. TabsToolbar { /* tab bar added 8-30-20 */
-moz-box-ordinal-group: 3 !important;
padding-top: 1 !important;    /* this is the line 11, change value from 0 to 0px or 1px  */

}

  1. main-window[tabsintitlebar] #toolbar-menubar[autohide="false"][inactive="false"] ~ #TabsToolbar:-moz-lwtheme,
  2. main-window[tabsintitlebar][sizemode="maximized"] #toolbar-menubar[autohide="false"][inactive="false"] ~ #TabsToolbar:-moz-lwtheme,
  3. main-window[uidensity=compact][tabsintitlebar] #toolbar-menubar[autohide="false"][inactive="false"] ~ #TabsToolbar:-moz-lwtheme,
  4. main-window[uidensity=compact][tabsintitlebar][sizemode="maximized"] #toolbar-menubar[autohide="false"][inactive="false"] ~ #TabsToolbar:-moz-lwtheme,
  5. TabsToolbar:-moz-lwtheme,
  6. main-window[tabsintitlebar][sizemode="maximized"] #toolbar-menubar[autohide="false"][inactive="false"] ~ #TabsToolbar,
  7. main-window[uidensity=compact][tabsintitlebar][sizemode="maximized"] #toolbar-menubar[autohide="false"][inactive="false"] ~ #TabsToolbar,
  8. main-window[sizemode="maximized"] #TabsToolbar,
  9. main-window[tabsintitlebar]:not([style*='--lwt-header-image']):-moz-lwtheme #navigator-toolbox #toolbar-menubar[autohide="false"][inactive="false"] ~ #TabsToolbar,
  10. main-window[tabsintitlebar][sizemode="maximized"]:not([style*='--lwt-header-image']):-moz-lwtheme #toolbar-menubar[autohide="false"][inactive="false"] ~ #TabsToolbar,
  11. main-window[uidensity=compact][tabsintitlebar]:not([style*='--lwt-header-image']):-moz-lwtheme #toolbar-menubar[autohide="false"][inactive="false"] ~ #TabsToolbar,
  12. main-window[uidensity=compact][tabsintitlebar][sizemode="maximized"]:not([style*='--lwt-header-image']):-moz-lwtheme #toolbar-menubar[autohide="false"][inactive="false"] ~ #TabsToolbar,
  13. main-window[tabsintitlebar]:not([style*='--lwt-header-image']):-moz-lwtheme #TabsToolbar {
 -moz-padding-start: 3px !important;

}

  1. main-window[tabsintitlebar][sizemode="normal"]:not([sizemode="fullscreen"]) #TabsToolbar {
 margin-top: 3px !important;

}

  1. main-window[tabsintitlebar][sizemode="normal"][chromehidden~="menubar"] #TabsToolbar,
  2. main-window[tabsintitlebar][sizemode="normal"] #toolbar-menubar[autohide="false"][inactive] + #TabsToolbar,
  3. main-window[tabsintitlebar][sizemode="maximized"][chromehidden~="menubar"] #TabsToolbar,
  4. main-window[tabsintitlebar][sizemode="maximized"] #toolbar-menubar[autohide="false"][inactive] + #TabsToolbar {
 padding-top: 3px !important;

}

  1. main-window[tabsintitlebar] #toolbar-menubar[autohide="false"]:not([inactive="false"]) ~ #TabsToolbar,
  2. main-window[tabsintitlebar] #toolbar-menubar[autohide="false"] ~ #TabsToolbar{
 margin-top: 3px !important;

}

/* tab title in titlebar support */

  1. main-window[tabsintitlebar][sizemode="normal"] #navigator-toolbox #TabsToolbar,
  2. main-window[uidensity=compact][tabsintitlebar][sizemode="normal"] #navigator-toolbox #TabsToolbar,
  3. main-window[tabsintitlebar][sizemode="maximized"] #navigator-toolbox #TabsToolbar,
  4. main-window[uidensity=compact][tabsintitlebar][sizemode="maximized"] #navigator-toolbox #TabsToolbar,
  5. main-window[tabsintitlebar][sizemode="normal"] #navigator-toolbox #toolbar-menubar[autohide="false"][inactive="false"] ~ #TabsToolbar,
  6. main-window[uidensity=compact][tabsintitlebar][sizemode="normal"] #navigator-toolbox #toolbar-menubar[autohide="false"][inactive="false"] ~ #TabsToolbar,
  7. main-window[tabsintitlebar][sizemode="maximized"] #navigator-toolbox #toolbar-menubar[autohide="false"][inactive="false"] ~ #TabsToolbar,
  8. main-window[uidensity=compact][tabsintitlebar][sizemode="maximized"] #navigator-toolbox #toolbar-menubar[autohide="false"][inactive="false"] ~ #TabsToolbar{
 margin-top: 3px !important;

}

/* titlebar button support */

  1. main-window[tabsintitlebar] #toolbar-menubar[autohide="false"][inactive="false"] ~ #nav-bar{
 margin-top: 4px !important;

}

/* fix for application/hamburger button in titlebar */

  1. main-window[tabsintitlebar][sizemode="fullscreen"] #toolbar-menubar[autohide="False"][inactive="false"] ~ #nav-bar #PanelUI-button {
 visibility: collapse !important;

}

  1. main-window[inDOMFullscreen="false"] #TabsToolbar {
 opacity: 1 !important;

} /* Hide blue stripe on active tab */ .tab-line[selected="false"] {

 opacity: 1 !important;

} /* tab height */

  1. tabbrowser-tabs,
  2. tabbrowser-tabs > .tabbrowser-arrowscrollbox,

.tabbrowser-tabs[positionpinnedtabs] > .tabbrowser-tab[pinned] {

 min-height: var(--tab-min-height_tnot) !important;

}

/* toolbar order (start) ************************************/

  1. print-preview-toolbar,
  2. printedit-toolbar,
  3. titlebar {
 -moz-box-ordinal-group: 0 !important;

}

  1. navigator-toolbox #toolbar-menubar {
 -moz-box-ordinal-group: 1 !important;

} /* navigation toolbar */

  1. navigator-toolbox #nav-bar {
 -moz-box-ordinal-group: 2 !important;

} /* bookmarks toolbar */

  1. navigator-toolbox #PersonalToolbar {
 -moz-box-ordinal-group: 3 !important;

} /* 3rd party toolbars */

  1. navigator-toolbox toolbar {
 -moz-box-ordinal-group: 10 !important;

} /* tabs toolbar */

  1. navigator-toolbox #TabsToolbar {
 -moz-box-ordinal-group: 100 !important;

} /* toolbar order (end) **************************************/

/* toolbar colors */

  1. main-window:not([tabsintitlebar]) #toolbar-menubar:not(:-moz-lwtheme) {
 background-image: var(--colored_menubar_background_image) !important;
 border: 3px !important;
 margin-bottom: 2px !important;

}

  1. nav-bar:not(:-moz-lwtheme) {
 -moz-appearance: 2px !important;
 background: var(--general_toolbar_color_navbar, inherit) !important;

}

toolbar:not(#TabsToolbar):not(#toolbar-menubar):not(#nav-bar):not(:-moz-lwtheme) {

 -moz-appearance: 2px !important;
 background: var(--general_toolbar_color_toolbars, inherit) !important;

}

  1. TabsToolbar:not(:-moz-lwtheme){
 -moz-appearance: none !important;
 background-image: var(--tabs_toolbar_color_tabs_not_on_top) !important;

}

/* remove color overlay for lw-themes */

  1. main-window[style*='--lwt-header-image'] :-moz-any(#nav-bar,#PersonalToolbar,#TabsToolbar):-moz-lwtheme{
 background: unset !important;

}

/* adjust compact themes background color */

  1. main-window:not([style*='--lwt-header-image']) #TabsToolbar:-moz-lwtheme {
 -moz-appearance: none !important;
 background-image: linear-gradient(var(--toolbar-bgcolor),var(--toolbar-bgcolor)) !important;

}

  1. main-window:not(:-moz-lwtheme) #TabsToolbar :-moz-any(.tabs-newtab-button,#tabs-newtab-button,.scrollbutton-up,.scrollbutton-down),
  2. main-window:not(:-moz-lwtheme) #TabsToolbar > toolbarbutton,
  3. main-window:not([style*='--lwt-header-image']):-moz-lwtheme:-moz-lwtheme-darktext #TabsToolbar :-moz-any(.tabs-newtab-button,#tabs-newtab-button,.scrollbutton-up,.scrollbutton-down),
  4. main-window:not([style*='--lwt-header-image']):-moz-lwtheme:-moz-lwtheme-darktext #TabsToolbar > toolbarbutton {
 fill: var(--classic_squared_tabs_new_tab_icon_color) !important;
 color: var(--classic_squared_tabs_new_tab_icon_color) !important;

}

/* toolbar borders */

  1. main-window #navigator-toolbox::after {
 opacity: 1 !important;

}

  1. TabsToolbar{
 margin-bottom: 3px !important;
 border-bottom: 3px solid #5f7181 !important;

}

  1. main-window[sizemode="normal"] #navigator-toolbox :-moz-any(#nav-bar,#PersonalToolbar,#TabsToolbar) {
 border-left: var(--tabs_toolbar_border-tnot_normal_mode_size) solid var(--tabs_toolbar_border-tnot_normal_mode) !important;
 border-right: var(--tabs_toolbar_border-tnot_normal_mode_size) solid var(--tabs_toolbar_border-tnot_normal_mode) !important;
 background-clip: padding-box !important;

}

  1. main-window[sizemode="maximized"] #navigator-toolbox :-moz-any(#nav-bar,#PersonalToolbar,#TabsToolbar) {
 border-left: 0px !important;
 border-right: 0px !important;

}

  1. main-window[style*='--lwt-header-image'][sizemode="normal"] #navigator-toolbox :-moz-any(#nav-bar,#PersonalToolbar,#TabsToolbar):-moz-lwtheme,
  2. main-window[style*='--lwt-header-image'][sizemode="maximized"] #navigator-toolbox :-moz-any(#nav-bar,#PersonalToolbar,#TabsToolbar):-moz-lwtheme {
 border-top: 3px !important;
 border-left: 3px !important;
 border-right: 3px !important;

}

  1. main-window:not([style*='--lwt-header-image']):-moz-lwtheme-brighttext #TabsToolbar:-moz-lwtheme {
 border-bottom: 3px solid #323234 !important;

}

  1. main-window:not([style*='--lwt-header-image']):-moz-lwtheme:-moz-lwtheme-brighttext #TabsToolbar:-moz-lwtheme {
 border-bottom: 3px solid #323234 !important;

}

  1. main-window:not([sizemode="fullscreen"])[tabsintitlebar] #TabsToolbar{
 -moz-margin-end: 0px !important;

}

  1. main-window[tabsintitlebar] #TabsToolbar .titlebar-placeholder{
 visibility: collapse !important;

}

  1. main-window[tabsintitlebar][sizemode="normal"] #toolbar-menubar[autohide="false"][inactive="false"] {
 margin-top: 21px !important;

}

  1. main-window[tabsintitlebar][sizemode="maximized"] #toolbar-menubar[autohide="false"][inactive="false"] {
 margin-top: 20px !important;

}

  1. tabbrowser-tabs .tab-drop-indicator {
 margin-bottom: 3px !important;

}

  1. PersonalToolbar:-moz-lwtheme,
  2. nav-bar:-moz-lwtheme {
 background-image: none !important;
 box-shadow: none !important;
 border-top: 4px !important;
 border-bottom: none !important;

}

/* remove tab fog */

  1. TabsToolbar:not(:-moz-lwtheme),
  2. TabsToolbar:not(:-moz-lwtheme)::before,
  3. TabsToolbar:not(:-moz-lwtheme)::after {
 box-shadow: unset !important;

}

/* remove 'dragging tab' margin/padding nonsense */

  1. TabsToolbar[movingtab] {
 padding-bottom: unset !important;

}

  1. TabsToolbar[movingtab] > .tabbrowser-tabs {
 padding-bottom: unset !important;
 margin-bottom: unset !important;

}

  1. TabsToolbar[movingtab] + #nav-bar {
 margin-top: 4px !important;

}

/* scroll buttons */

  1. TabsToolbar:not(:-moz-lwtheme) #alltabs-button,
  2. TabsToolbar:not(:-moz-lwtheme) .tabbrowser-arrowscrollbox > .scrollbutton-up,
  3. TabsToolbar:not(:-moz-lwtheme) .tabbrowser-arrowscrollbox > .scrollbutton-down {
 fill: black !important;

}

/* Fx58+ titlebar placeholders */

  1. TabsToolbar *[type="pre-tabs"],
  2. TabsToolbar *[type="post-tabs"] {
 display: none !important;

}

@media (-moz-os-version: windows-win10) { #main-window[tabsintitlebar][sizemode="normal"] #toolbar-menubar[autohide="false"][inactive="false"] { margin-top: 30px !important; } #main-window[tabsintitlebar][sizemode="maximized"] #toolbar-menubar[autohide="false"][inactive="false"] { margin-top: 30px !important; }