This site will have limited functionality while we undergo maintenance to improve your experience. If an article doesn't solve your issue and you want to ask a question, we have our support community waiting to help you at @FirefoxSupport on Twitter and/r/firefox on Reddit.

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

How to access Tabs

  • 7 respostas
  • 1 has this problem
  • 3 views
  • Last reply by scottish2

more options

I see Mozilla has done it again how the heck do I access my tabs they all briefly showed at the bottom in the status bar and then all vanished!

And I know the update is new but how do I get them back to where I had them??? I do not want my tabs at the bottom of my browser I want them right where I had them at the bottom of the header bars at top of screen!

I see Mozilla has done it again how the heck do I access my tabs they all briefly showed at the bottom in the status bar and then all vanished! And I know the update is new but how do I get them back to where I had them??? I do not want my tabs at the bottom of my browser I want them right where I had them at the bottom of the header bars at top of screen!

Chosen solution

Okay, go back to your working tabs-on-bottom code, and then here is how you can safely combine the files:

(1) Download the SVG Fill file, it's name is userChrome-color_bookmark_folders_Proton89.css

(2) Put that file in your chrome folder next to your userChrome.css file

(3) Paste this new line on the top of your userChrome.css file (@import lines need to be before other lines):

@import url(userChrome-color_bookmark_folders_Proton89.css);

When Firefox starts, it will read in the file and then continue with the rest of userChrome.css.

Success?

More info on this method: https://www.userchrome.org/adding-style-recipes-userchrome-css.html

Ler a resposta no contexto 👍 1

All Replies (7)

more options

Hello, have you been using style rules in a userChrome.css file to move your tabs below the address bar? The old CSS rules cause the tabs to clump together at the very bottom of the browser. You need to delete the CSS (to return to the standard layout) or update it to work with Firefox 89.

You could take a look at this thread: https://support.mozilla.org/questions/1338147

more options

jscher2000 said

Hello, have you been using style rules in a userChrome.css file to move your tabs below the address bar? The old CSS rules cause the tabs to clump together at the very bottom of the browser. You need to delete the CSS (to return to the standard layout) or update it to work with Firefox 89. You could take a look at this thread: https://support.mozilla.org/questions/1338147

Yeah let me remove it and reload as this is totally browser breaking the way it is. Will update this once I reload.

UPDATE: OK so I have tabs back again and the post you posted for REDDIT did get the tabs back on bottom again. Gonna check on the color options see if I can get them back.

While I search that any ideas?

This is the code I currently have in my CSS file. The bottom section is a section of code we used to colorize the folders and such but doesn't seem to be working on this update.

Also my bookmark tool bar the drop down menus seem to have just a tad to much space between the items in the list. I have tried adjusting some of the height numbers but not found the right one. Is there a way in the code below I might have missed to remove some of the spacing between items in the drop down menus list for the bookmarks toolbar.

/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */

/* Modify to change window drag space width */
/*
Use tabs_on_bottom_menubar_on_top_patch.css if you
have menubar permanently enabled and want it on top
*/

/* IMPORTANT */
/*
Get window_control_placeholder_support.css
Window controls will be all wrong without it.
Additionally on Linux, you may need to get:
linux_gtk_window_control_patch.css
*/

:root{ --uc-titlebar-padding: 0px; }
@media (-moz-os-version: windows-win10){
:root[sizemode="maximized"][tabsintitlebar]{ --uc-titlebar-padding: 8px }
}
#toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container,
#TabsToolbar > .titlebar-buttonbox-container{
position: fixed;
display: block;
top: var(--uc-titlebar-padding,0px);
right:0;
height: 35px;
}
/* Mac specific. You should set that font-smoothing pref to true if you are on any platform where window controls are on left */
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
:root{ --uc-titlebar-padding: 0px !important }
.titlebar-buttonbox-container{ left:0; right: unset !important; }
}

:root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container{ height: 32px }

#toolbar-menubar[inactive] > .titlebar-buttonbox-container{ opacity: 0 }

#navigator-toolbox{ padding-top: var(--uc-titlebar-padding,0px) !important; }

.titlebar-buttonbox-container > .titlebar-buttonbox{ height: 100%; }

#titlebar{
-moz-box-ordinal-group: 2;
-moz-appearance: none !important;
--tabs-navbar-shadow-size: 0px;
}

.titlebar-placeholder,
#TabsToolbar .titlebar-spacer{ display: none; }
/* Also hide the toolbox bottom border which isn't at bottom with this setup */
#navigator-toolbox::after{ display: none !important; }

@media (-moz-gtk-csd-close-button){ .titlebar-button{ -moz-box-orient: vertical } }

/* These exist only for compatibility with autohide-tabstoolbar.css */
toolbox#navigator-toolbox > toolbar#nav-bar.browser-toolbar{ animation: none; }
#navigator-toolbox:hover #TabsToolbar{ animation: slidein ease-out 48ms 1 }

/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom_menubar_on_top_patch.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */

/* Menubar on top patch - use with tabs_on_bottom.css */
/* Only really useful if menubar is ALWAYS visible */

:root{ --uc-window-control-width: 0px !important }

#navigator-toolbox{ padding-top: calc(29px + var(--uc-titlebar-padding,0px)) !important }

#toolbar-menubar{
position: fixed;
display: flex;
top: var(--uc-titlebar-padding,0px);
height: 25px;
width: 100%;
overflow: hidden;
}

#toolbar-menubar > .titlebar-buttonbox-container{ height: 29px; order: 100; }

#toolbar-menubar > [flex]{ flex-grow: 100; }
#toolbar-menubar > spacer[flex]{
order: 99;
flex-grow: 1;
min-width: var(--uc-window-drag-space-width,20px);
}

#toolbar-menubar .titlebar-button{ padding: 2px 17px !important; }

#toolbar-menubar .toolbarbutton-1 { --toolbarbutton-inner-padding: 3px }

/* TABS: height */*|*:root { --tab-toolbar-navbar-overlap: 0px !important; --tab-min-height: 29px !important;
--tab-min-width: 80px !important;

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

.tab-background {
border-radius: 8px 8px 0px 0px !important; border-image: none !important;
}
.tab-line {
display: none;
}

.tab-close-button {
color: red!important;
}

/* Colored bookmark sidebar, toolbar, menu button containers */
  /* Standard folder */
  #bookmarks-view treechildren::-moz-tree-image(container),
  #PlacesToolbarItems toolbarbutton[container="true"] .toolbarbutton-icon,
  #PlacesToolbarItems menu[container="true"] .menu-iconic-left,
  #BMB_bookmarksPopup menu[container="true"] .menu-iconic-icon {
    fill: gold !important;
  }
  /* Live Bookmark (RSS Feed) */
  #bookmarks-view treechildren::-moz-tree-image(container, livemark),
  #PlacesToolbarItems toolbarbutton[container="true"][livemark="true"] .toolbarbutton-icon,
  #PlacesToolbarItems menu[container="true"][livemark="true"] .menu-iconic-left,
  #BMB_bookmarksPopup menu[container="true"][livemark="true"] .menu-iconic-icon {
    fill: orange !important;
  }
  /* Smart bookmark folder */
  #bookmarks-view treechildren::-moz-tree-image(container, query),
  #PlacesToolbarItems toolbarbutton[container="true"][query="true"] .toolbarbutton-icon,
  #PlacesToolbarItems menu[container="true"][query="true"] .menu-iconic-left,
  #BMB_bookmarksPopup menu[container="true"][query="true"] .menu-iconic-icon {
    fill: dimtan !important;
  }
  /* These "containers" are SVG in the sidebar, not yet on the menu */
  #bookmarks-view treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksMenu) {
    fill: tan !important;
  }
  #bookmarks-view treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksToolbar) {
    fill: tan !important;
  }
  #bookmarks-view treechildren::-moz-tree-image(container, OrganizerQuery_UnfiledBookmarks) {
    fill: tan !important;
  }

cor-el modificouno o

more options

OK in answer to your PM question no just the outline as the color seems to stay black even though we had a color on the frame last time. And not sure on the middle as I can't remember what it was and there is a reference a number of times to fill like the line below as an example from the code above

#BMB_bookmarksPopup menu[container="true"][livemark="true"] .menu-iconic-icon {

  fill: orange !important;
more options
more options

That worked but one issue was it moved my tabs back on top. I tried combining the codes to keep the tabs on bottom but then it removed the color. thoughts?

more options

Chosen Solution

Okay, go back to your working tabs-on-bottom code, and then here is how you can safely combine the files:

(1) Download the SVG Fill file, it's name is userChrome-color_bookmark_folders_Proton89.css

(2) Put that file in your chrome folder next to your userChrome.css file

(3) Paste this new line on the top of your userChrome.css file (@import lines need to be before other lines):

@import url(userChrome-color_bookmark_folders_Proton89.css);

When Firefox starts, it will read in the file and then continue with the rest of userChrome.css.

Success?

More info on this method: https://www.userchrome.org/adding-style-recipes-userchrome-css.html

more options

Perfect THANKS! You're always a huge help getting these issues resolved!!!