From what Firefox version did you update ?

It is likely that your userChrome.css file for getting the tab on bottom is broken for this release.

If you remember where you got the content for placing the tabs on lower position then you can look for an update. Otherwise you can attach your current userChrome.css to see whether we can give advice on how to fix this. I haven't noticed that changes were needed from Firefox 72 to Firefox 73.

You can try this code:

• https://support.mozilla.org/en-US/questions/1274416#answer-1279083

Hi CatsinQ, you need to update your "tabs on bottom" rules to get rid of the overlap. The amount of updating varies depending on the last version your rules worked with. For example, recently several users needed to remove an @namespace line from above their tabs-on-bottom code.

I don't know whether the new tab button will turn out to be fixed by the same changes, but hopefully it will.

There are so many threads on this, and people are starting in so many different places, that it's frustrating to help. If you want to start your "tabs on bottom" rules from scratch, I have a rules file you could use over here:

https://www.userchrome.org/what-is-userchrome-css.html#movetabbar

For me it is still possible to have the code work with @namespace for XUL. I only needed to use *|*:root to define variables and for some other selectors.

Cor-el and jscher2000: Thanks to both of you.

I'm not sure what version I updated from. It did it automatically.

Cor-el, I tried to follow your instructions and it DID help, the tabs are no longer overlapping the nav bar, but now the tabs are inbetween the menu bar and the nav bar and I really want them to be on the bottom. (sigh) but at least I can see what I'm doing!

jscher2000: I also tried to follow your instructions - by just taking out the @namespace - but ended up with the same issue. Tabs are not on bottom.

Is there anywhere else I could pick up code from? I am not a programmer and am so confused by all this stuff. It's a miracle I can navigate to my css file!

The code I formerly had was the following. ''

   @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */

   /* TABS: on bottom */
   #navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group:10}
   #TabsToolbar {-moz-box-ordinal-group:1000!important}

   #TabsToolbar {
    display: block !important;     
    position: absolute !important;
    bottom: 0 !important;
    width: 100vw !important;
   }

   #tabbrowser-tabs {
     width: 100vw !important;
   }
   #main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {padding-bottom: var(--tab-min-height) !important;}

   /* TABS: height */
   :root {
    --tab-toolbar-navbar-overlap: -27px !important;
    --tab-min-height: 27px !important; /* adjust to suit your needs */
   }
   :root #tabbrowser-tabs {
    --tab-min-height: 27px !important; /* needs to be the same as above under :root */
    --tab-min-width: 80px !important;
   }

   #TabsToolbar {
    height: var(--tab-min-height) !important;
    margin-bottom: 1px !important;
    box-shadow: ThreeDShadow 0 -1px inset, -moz-dialog 0 1px !important;
   }

   #tabbrowser-tabs,
   #tabbrowser-tabs > .tabbrowser-arrowscrollbox,
   .tabbrowser-tabs[positionpinnedtabs] > .tabbrowser-tab[pinned] {
     min-height: var(--tab-min-height) !important;
     max-height: var(--tab-min-height) !important;
   }

   /* drag space */
   .titlebar-spacer[type="pre-tabs"],
   .titlebar-spacer[type="post-tabs"] {
     width: 40px;
   }

   /* Override vertical shifts when moving a tab */
   #navigator-toolbox[movingtab] > #titlebar > #TabsToolbar {
     padding-bottom: unset !important;
   }
   #navigator-toolbox[movingtab] #tabbrowser-tabs {
     padding-bottom: unset !important;
     margin-bottom: unset !important;
   }
   #navigator-toolbox[movingtab] > #nav-bar {
     margin-top: unset !important;
   }

   #TabsToolbar .tabbrowser-tab .tab-content {
     font-weight: 800 !important;

   }

''

Sorry - but I've GOT to go to bed. I know it's better if I stay up and keep working with you guys, but I have work very early in the am and haven't eaten dinner yet and it's already time to go to bed. I promise to try any new suggestions tomorrow as soon as I get home. Thank you both so much.

This is my current code:

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

/* TABS: bottom - Firefox 65 and later */
/* /source/browser/themes/shared/tabs.inc.css */

/* ROOT - VARS */
*|*:root {
 --tab-toolbar-navbar-overlap: 0px !important;

 --tab-min-height:      25px !important; /* adjust */
 --tab-min-width:       60px !important; /* adjust */

 --tabstoolbar-adjust:     -22px; /* menubar titlebar hidden */
 --personal-toolbar-height: 20px; /* personal-toolbar 20px */
 --captionbox-adjust: calc(-15px + var(--personal-toolbar-height));
}

/* TAB BAR on bottom */
#navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {
  -moz-box-ordinal-group: 10 !important;
}

#TabsToolbar {
  -moz-box-ordinal-group: 1000 !important;
  position: absolute !important;
  display: block !important;
  bottom: 0 !important;
/* width: 100vw !important; */
}

#tabbrowser-tabs {
  width: 100vw !important;
}

/* navigator-toolbox - padding */
*|*:root:not([chromehidden*="toolbar"]) #navigator-toolbox {
  padding-bottom: calc(var(--tab-min-height) + 1px) !important;
}

/* TabsToolbar with menubar and titlebar hidden - leave out in case of issues and possibly in Nightly builds */
*|*:root[tabsintitlebar]:not([inFullscreen="true"]):not([sizemode="maximized"])
 #toolbar-menubar[autohide="true"] ~ #TabsToolbar{
  bottom: var(--tab-min-height) !important;
  padding-top: calc(var(--tab-min-height) + var(--tabstoolbar-adjust)) !important; /*adjust var*/
}

/* TABS: height */
#tabbrowser-tabs,
#tabbrowser-tabs > .tabbrowser-arrowscrollbox,
.tabbrowser-tabs[positionpinnedtabs] > .tabbrowser-tab[pinned] {
  min-height: var(--tab-min-height) !important;
  max-height: var(--tab-min-height) !important;
}

#TabsToolbar {
  height: var(--tab-min-height) !important;
  margin-bottom: 1px !important;
  box-shadow: ThreeDShadow 0 -1px inset, -moz-dialog 0 1px !important; /* omit */
  background-color: var(--toolbar-bgcolor) !important;
  color: var(--toolbar-color) !important;
}

/* possibly show private-browsing-indicator*//*
*|*:root[privatebrowsingmode=temporary] .private-browsing-indicator {
  position: absolute !important;
  display: block !important;
  right: 0px !important;
  bottom: 0px !important;
  width: 14px !important;
  pointer-events: none !important;
}
*/

/* hide indicators */
.private-browsing-indicator {display: none !important;}
.accessibility-indicator    {display: none !important;}

/* Drag Space */
.titlebar-spacer[type="pre-tabs"],
.titlebar-spacer[type="post-tabs"] {
  width: 20px !important;
}

/* Override vertical shifts when moving a tab */
#navigator-toolbox[movingtab] > #titlebar > #TabsToolbar {
  padding-bottom: unset !important;
}

#navigator-toolbox[movingtab] #tabbrowser-tabs {
  padding-bottom: unset !important;
  margin-bottom: unset !important;
}

#navigator-toolbox[movingtab] > #nav-bar {
  margin-top: unset !important;
}

/* window-controls - full screen */
#TabsToolbar #window-controls {display: none !important;}

/* caption buttons - possibly show - needs adjustment for the personal toolbar */
*|*:root[tabsintitlebar]:not([inFullscreen="true"]) #toolbar-menubar[autohide="true"]
 ~ #TabsToolbar .titlebar-buttonbox-container {
  position: fixed !important;
  display: block !important;
  right: 0 !important;
  top: calc(var(--tab-min-height) + var(--captionbox-adjust)) !important;
  height: var(--tab-min-height) !important;
  visibility: visible !important;
}

/* caption buttons - HEIGHT */
.titlebar-buttonbox-container .titlebar-button {
  height: var(--tab-min-height) !important;
  margin: 0px -5px 0px -5px !important;
  padding: 0px !important;
}

/* caption buttons - PADDING */
*|*:root[tabsintitlebar]:not([inFullscreen="true"])
 #toolbar-menubar[autohide="true"] ~
  #TabsToolbar {
   padding-right: 90px !important; /*adjust*/
}

/* END - Tabs on bottom */

OMG, thank you so much!!! You're a genius! What kind of education do you have that you know how to write this stuff? It's a wonderful skill!

All of the 'Solutions' above are totally irrelevant.

I had to reinstall 73.0.1 I recovered all items in my profile except Top Sites. I can not add any Top Sites.

All of my top sites were pinned. They were not restored when I restored my profile.

I click the three dots in the upper left corner of the Top Sites area. The drop down menu appears. I select Add Top Site. The Add Top Site dialog appears.

I insert a url, enter a title and insert a custom image url.

I click preview and the correct image appears in the icon box.

I click the Add button and dialog box goes away and absolutely nothing else happens.

I am left with zero Top Sites.

Thanks: MikeD [email address]

Hi MikeD

Your problems seem to have nothing to do with the subject of this thread that is about moving the Tab bar from the position above the Navigation Toolbar to the position below the Navigation Toolbar and the Bookmarks Toolbar using code in userChrome.css.

Could you please create a new thread for your question. Thank you.

• https://support.mozilla.org/en-US/kb/get-community-support