منتدى دعم ”Firefox“

Hi All,

I would like the content area of my tabs moved up so that the box is filled with the actual tab color, without the white background, and also the text will be vertically centered. Right now, the text is dropping too close to the bottom of the tab.

Had this looking very nice in FF 88 with the same code, as you can see in the attached images, but it seems to render differently in FF 115 ESR and FF 125.

Below is some code I used to style the tabs, but the problem exists without this code as well.

I've also included some "tabs on bottom" code I'm using as well at the very bottom.

Would sure like to get those Classic Toolbar Buttons working again too (shown in the second image), but that will be a later request :)

Any help is appreciated.

Thanks!

/* Highlight non-selected tabs on mouseover */ .tabbrowser-tab:not([selected]):hover .tab-content {

  background-color: #dbe3eb !important;

}

1. TabsToolbar {

 -moz-box-ordinal-group: 3 !important;
 padding-top: 0 !important;
 padding-bottom: 0 !important;
 height: 25px !important;
 background-image: url("bkmr_back.gif") !important;
 border-top: 1px solid #afc0d2 !important;
 border-bottom: 1px solid #8698aa !important;

}

/* Background color of selected tab */ .tab-background[selected="true"] {

   background-attachment: none!important;
   background-image: none!important;
   background-color: #eef5fc !important;

}

/* Background color of non-selected tab */ tab-background:not([selected]) {

   color: #000000 !important;
   background-color: #c7d3e0 !important;

}

/* Border color & bold text for selected tab */

1. TabsToolbar .tabbrowser-tab[selected] {

   font-weight: 700 !important;
   color: #000 !important;
   border-top: 1px solid #8698aa !important;
   border-left: 1px solid #8698aa !important;
   border-right: 1px solid #8698aa !important;

}

/* Border color & normal text for non-selected tab */

1. TabsToolbar .tabbrowser-tab:not([selected]) {

   font-weight: 600 !important;
   color: #000 !important;
   border-top: 1px solid #afc0d2 !important;
   border-left: 1px solid #afc0d2 !important;
   border-right: 1px solid #afc0d2 !important;

}

/* -------------- TABS ON BOTTOM --------------- */ /* TABS: below nav-bar - updated for 89+ | 108+ | 113+ */

• |*:root {

 --tab-toolbar-navbar-overlap: 0px !important;
 --tab-min-height: 25px !important; /* adjust */
 --tab-min-width:  80px !important; /* adjust */

}

1. navigator-toolbox #TabsToolbar {

 position: absolute !important;
 bottom: 0;
 /* height: 27px !important; */
 height: 28px !important;
 width: 100vw !important;

}

/* navigator-toolbox - padding */

• |*:root:not([chromehidden*="toolbar"]) #navigator-toolbox {

 position: relative !important; /*89+*/
 padding-bottom: calc(var(--tab-min-height) + 1px) !important; /*adjust*/
 background-color: var(--toolbar-bgcolor) !important;

}

/* TABS: HEIGHT */

1. tabbrowser-tabs,
2. tabbrowser-arrowscrollbox,
3. tabbrowser-tabs .tabbrowser-tab {

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

}

.tab-stack {

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

}

1. TabsToolbar {

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

}

/* drag space */ .titlebar-spacer[type="pre-tabs"], .titlebar-spacer[type="post-tabs"] {

 width: 40px;

}

/* Override vertical shifts when moving a tab */

1. navigator-toolbox[movingtab] > #titlebar > #TabsToolbar {

 padding-bottom: unset !important;

}

1. navigator-toolbox[movingtab] #tabbrowser-tabs {

 padding-bottom: unset !important;
 margin-bottom: unset !important;

}

1. navigator-toolbox[movingtab] > #nav-bar {

 margin-top: unset !important;

}

/* hide indicators and caption buttons */

1. TabsToolbar .private-browsing-indicator {display: none !important;}
2. TabsToolbar .accessibility-indicator {display: none !important;}
3. TabsToolbar .titlebar-buttonbox-container {display: none !important;}
4. TabsToolbar #window-controls {display: none !important;}

/* -------------- TABS ON BOTTOM --------------- */

Hi so am using version 125.0.1 and on my windows 10 machine I can add custom Search Shortcuts (the Add button is present) but on my windows 11 machine, the same settings page the Add button is dissapeared... Is it a limitation for Windows 11 machines?

Just updated a friend's computer from Windows 7 to 10. Installed firefox over previous ESR and now there's no way to remove the search bar from the new tab page. On my W10 system, the search bar isn't there, not sure how or why, but on her's there's no option NOT to show it as there used to be.

I found some VERY old (2014) info on this but doesn't seem to be up to date.

PLEASE give us our options back and stop taking them away, sheesh, getting as bad as Microsoft.

Is there a workaround for this to remove the redundant search bar from the new tab page since you can search from the address bar?

Thanks!

I made a small CSS customization to my tabs in FF 115 ESR on Windows 7, so they would be flat on the bottom and rounded on the top, looking a bit more like tabs instead of buttons.

Looked ok in FF 115 ESR.

However, in FF 125, half the tabs are now cut off, including their text (see attached images).

Also the tabs background is darker in FF 115 ESR, providing more contrast between the tabs and the tab bar. In FF 125, it's almost all white and I can hardly distinguish between the tabs and the tab bar.

Why is there such a big difference in appearance between FF 115 ESR on Windows 7, and FF 125 on Windows 10?

Here is the code I used...

/* ------------------ RESIZE TAB BAR ----------------------------- */ \#TabsToolbar { height: 27px !important; margin-top: -1px !important; margin-bottom: 0px !important; } \#tabbrowser-tabs { height:25px!important; min-height:25px!important; }

.tab-background-start[selected=true]::after, .tab-background-start[selected=true]::before, .tab-background-start, .tab-background-end, .tab-background-end[selected=true]::after, .tab-background-end[selected=true]::before {

 min-height:25px!important;

.tabbrowser-tab {
 max-height: 25px !important;
 border-color: #8f939e;

 max-height: 25px !important;
 border-color: #8f939e;

} /* ------------------ TAB HEIGHT END ----------------------------- */

I inserted backslashes at the beginning of the first 2 lines of code above to preserve the hashtag sign (otherwise it displays an index number before those lines), please ignore the backslashes.

I would like my customizations in Firefox 125 to look like the ones I made in 115 ESR.

Is it possible?

Thanks!

Hi,

I'm using FF on Fedora 39.

However Firefox does not remember any file associations. The MimeTypes.rdf file in the profile is missing and is also not created on restarting the browser.

In the options I've now set the configuration to "Ask whether to open or save files". Now I see a popup when clicking on a file however there is no checkbox with "remember this file associations" (or something similiar).

I'd like to be able to open a link in private mode by holding down some modifier key, then clicking on the link. There are many times that I want to open a link in private mode, and a keypress + click would be the quickest way to do it given that one hand typically remains at the keyboard while I use the mouse/trackpad.

I've even added a toolbar button to open a new private browsing window, then dragged and dropped a link onto the button, but that gets a circle with slash icon and nothing more.

Others have asked this question, so, to be clear, none of the following address my question: copying the link then opening the private browsing window & pasting the link, using a customized shortcut/bookmark, opening Firefox in private mode via command line, right-clicking the link then selecting "Open link in new private window".

Thanks for any advice and thank you, Mozilla, for Firefox!

When reloading a page, or navigating to a new page, the default Stop icon momentarily appears over my own Reload icon, and the default Reload icon also appears over my Stop icon.

Please see attached image and animation.

Any idea if this is a minor bug?

Below is my code to split the Reload button into Reload & Stop buttons, then to add text to the navigation buttons, and finally to add icons to the navigation buttons.

This anomaly happens whether or not I split the Reload & Stop buttons. With just a single Reload button, I'm also seeing the default Reload icon appear over my own.

Thank you.

/* ---------- SPLIT RELOAD BUTTON INTO RELOAD & STOP ------------- */

#reload-button, #stop-button {
   display: inherit !important; 
} 

#reload-button > .toolbarbutton-icon {
  -moz-appearance: none !important; 
}

/* ------------ ADD TEXT LABELS TO NAVIGATION TOOLBAR BUTTONS --------------- */

/* Shows both icon and label for toolbarbuttons */

toolbar .toolbarbutton-1[label]{
  flex-direction: column;
  align-items: center !important;
}

toolbar .toolbarbutton-1[label]:not([disabled]):hover{ background-color: var(--toolbarbutton-hover-background) !important; }

toolbar .toolbarbutton-1[label] > .toolbarbutton-icon,
toolbar .toolbarbutton-1[label] > .toolbarbutton-badge-stack{
  padding: var(--toolbarbutton-inner-padding) !important;
  padding-bottom: 0px !important;
  height: calc(var(--toolbarbutton-inner-padding) + 16px) !important;
  border: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

toolbar .toolbarbutton-1[label] > .toolbarbutton-text {
  display: flex !important;
  min-height: 16px !important;
  padding-top: 3px !important;
  padding-bottom: 6px !important;
  background-color: transparent !important;
  overflow: hidden;
  width: 9ch; /* changes space between buttons */
}
toolbar .toolbarbutton-1[label] > .toolbarbutton-text::before{
  margin-inline: auto;
 }
:root:not([uidensity="compact"]) toolbar .toolbarbutton-1[label] > .toolbarbutton-text{ padding: 2px !important; }

/* ------------ ADD CUSTOM ICONS TO NAVIGATION TOOLBAR BUTTONS ----------- */

#back-button {
   list-style-image: url("image/back.png") !important;
   padding-top: 8px !important;
}
#back-button image{
   max-height: 16px !important; 
   max-width: 16px !important;
   padding: 0px !important;
   margin-bottom: 3px !important;
}
#forward-button {
   list-style-image: url("image/forward.png") !important;
   padding-top: 8px !important;
}
#forward-button image{
   max-height: 16px !important; 
   max-width: 16px !important;
   padding: 0px !important;
   margin-bottom: 3px !important;
}
#reload-button {
   list-style-image: url("image/reload.png") !important;
   padding-top: 8px !important;
}
#reload-button image{
   max-height: 16px !important; 
   max-width: 16px !important;
   padding: 0px !important;
   margin-bottom: 3px !important;
}
#stop-button {
   list-style-image: url("image/stop.png") !important;
   padding-top: 8px !important;
}
#stop-button image{
   max-height: 16px !important; 
   max-width: 16px !important;
   padding: 0px !important;
   margin-bottom: 3px !important;
}
#print-button {
   list-style-image: url("image/print.png") !important;
   padding-top: 8px !important;
}
#print-button image{
   max-height: 16px !important; 
   max-width: 16px !important;
   padding: 0px !important;
   margin-bottom: 3px !important;
}
#home-button {
   list-style-image: url("image/home.png") !important;
   padding-top: 8px !important;
}
#home-button image{
   max-height: 16px !important; 
   max-width: 16px !important;
   padding: 0px !important;
   margin-bottom: 3px !important;
}

When visiting the "support.mozilla.org site, third-party translantion add-ons(such as "Immersive Translate") can't work. It says "can not read or change data on this site". I want to translate it on the same page rather than skipping into a new page. However, it can work on the "www.mozilla.org" site. When visiting on Chrome, there is not a problem. Is that site just privileged on Firefox ?

I accidentally pressed a lot of keys on my keyboard and for some reason the default colors of Firefox have changed. I found out that by using Ctrl+Alt+D that I can switch the colors back to normal or to the colors that now appear automatically, but this only works for one tab. If I open a new tab, it shows the weird colors (see images below). I tried looking up specific shortcuts for Firefox considering the shortcut mentioned before (Ctrl+Alt+D) only works on Firefox. But I can't find any shortcut tied to that combination. I'm unsure what to do and how to fix this.

I would appreciate it if someone could tell me how to fix this.

Hi All,

I would like to change the url border color when it has the focus to blue.

The code below works, except when you press Escape.

After hitting Escape, the urlbar still has the focus but its border changes back to gray. It should remain blue.

I would also like to remove the box-shadow after pressing Escape, when the urlbar is not expanded (to mimic the behavior of FF 88).

The url and search input fields also do the same goofy thing Windows 10 does - the cursor stops blinking after 5 blinks and remains frozen. Any way to remove that behavior and keep the cursor blinking? If not, no big deal, the other stuff above is more important.

Any code suggestions to get that behavior are welcome!

/* set the initial borders of the urlbar and search bar to gray */
#urlbar > #urlbar-background, #urlbar[breakout][breakout-extend] > #urlbar-background, #searchbar { border: 1px solid #a1a6b5 !important; outline: none !important; border-radius: 0px !important; }

/* set urlbar border to blue when focused */
#urlbar[breakout][breakout-extend] #urlbar-background {
   border-color: #0078d7 !important;
}

I'm trying to watch videos in Firefox. Youtube works but Xvideos does not. Firefox pops up a window asking me:

>> "Opening xvideos"."com ###.mp4". >> which is: MP4 Video (16.4MB) >> from https://cdn77-vid.xvideos-cdn"."com >> >> What should Firefox do with this file?

My only choice is: Open with Windows Media Player x86 (default)

suggestions?

I'm running Windows 7 Firefox 76.0.1

Thanks!!!!

How can I completely remove the tab bar and regain 3/4 of an inch of screen space. It would be nice if Mozilla would just have a on/off button for it. I've tried creating a folder called Chrome within my Firefox Profile folder. I then created a text file within that folder and named it userChrome.css. I put this string in the text file #tabbrowser-tabs { visibility: collapse !important; } This did not work, does anyone know the best method for getting rid of the annoying tab bar?

Thank you

Hello, I have been using Firefox as my main browser for more than a decade. One could say i am some Mozilla fanboy, having convinced many of my friends and relatives to use Firefox instead of any chrome based options (Which there are to many these days). It struck me today, as i was reworking some workflow elements in many programs i use daily, that it is impossible to change any key binding in Firefox anymore. I know it has been a while now, and i searched all over the web for an answer or a solution, but at this point it is clear that other than going in the code and recompiling Firefox manually, it is not possible. I stumbled upon the (only) extension that allows to change some shortcuts, but the two that i wanted to change are impossible to configure from it, being disabling only f12 as i would use it for other things but i do not want to lose the dev console and also ctrl+L to open the address bar, it is quite inconvenient and would much prefer to use ctrl+spacebar as it matches many other bindings i am using with other software. There have been many other features that were changed in the recent years that made me start to look for an alternative, as i see features melting away almost as quickly as the user base of the product.

I do understand that one person's problem is not going to change the way a big piece of software is working, but i am wondering, why are the users losing such features as basic as customizing key bindings in a piece of software that used to be so incredibly customizable in the past? Why is the only viable option to anything chrome based losing it's edge over the competition? Is Firefox v150 be based on the chromium engine or will it die before?

Thank you in advance, and no, i don't need the link to the shortcut page, i already have it.

I need to disable this horrible translator that is now showing up on top of every page I visit, It keeps showing up even after choosing a translation or disabling translations for that language. That is probably a bug, but I don't want to wait for a fix, I need to be able to see the pages I visit completely, this thing prevents me from clicking buttons and and is really anoying.

This is the built-in translation feature since I do not use any translation plugins, and started showing up after an upgrade.

Hello How to remove extension symbol from toolbar? ^(see image): https://i.imgur.com/2bh8se5.png Any idea? Thanks

Hello!

I have been using this userChrome.css code to hide the tab bar if there is only one tab (on Windows):

tab:only-of-type, tab:only-of-type + #tabs-newtab-button {

   display: none !important;

}

#tabbrowser-tabs, #tabbrowser-arrowscrollbox, #tabbrowser-tabs > .tabbrowser-arrowscrollbox {
   min-height: 0 !important;

}

Since one of the recent Firefox updates, this code does no longer work. Maybe because there is a new element in the tab bar: A drop-down list at the right.

Any idea how to make the above code work again?

Peter

Hey all, I just updated Firefox on PC and the updater asked a couple questions. I chose "Visionary" as the answer to a question because it suited me the best out of all the options. However, this also changed the colors of my browser menu and toolbar to green. The thing is, while green is a fine color, I would never select it as "my" color for anything ever.

I've tried to change the color in about:preferences, but nothing I can find seems to work. Any ideas?

Thanks!

Hi, everyone. My multirow bookmarks no longer seem to work since my latest update to 107.0 (64 bit). My computer crashed and when it came back up Firefox no longer worked. I reinstalled it and have a bit of cleanup to do, but everything works now except my faithful (up-to-now) multirow toolbar. Here's the code in my userChrome.css file.

/* Multi-Row Bookmarks Toolbar */

1. PersonalToolbar {

 /* Override max-height */
 min-height: unset !important;
 max-height: unset !important; */

}

1. PlacesToolbar > hbox:first-child {

   display: block

}

1. PlacesToolbarItems {

   display: flex;
   flex-wrap: wrap

}

Previously, this was in my profile folder. If I move this out of the profile folder, my browser works fine but there is no multi-row toolbar. If I put it back into the profile folder, I have a multi-row toolbar, but no contentd in the main window.

I am perplexed. Help? --elizabeth

I just updated to the latest version of Firefox, and all of a sudden I have a new icon, Extensions, that looks like a puzzle piece, I cant seem to be able to remove it....at all.

Hi, I'm a Firefox user since around 2004. Whenever I used FF i always opened multiple windows of FF. At some point Mozilla came out with Tabs. I don't use them and as a matter of fact I use the option under settings to open links in a new window (not tabs). Always have, Why? Habit I guess from the times I first starting using FF. I seriously don't use Tabs. I would like to Remove the Tab Bar from FF because of this reason and it frees up a lot of visual space on my browser. I've spent hours reading/searching/trying on "how" to remove or at least hide the Tab Bar. Waste of time so far, so I decided to Post the Question.

How Do I Hide or Remove the Tab Bar in FireFox?

Thanks For Everyone's Help in Advance:-)