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

Lolu chungechunge lwabekwa kunqolobane. Uyacelwa ubuze umbuzo omusha uma udinga usizo.

Disable bloated address bar?

  • 8 uphendule
  • 1 inale nkinga
  • 46 views
  • Igcine ukuphendulwa ngu cor-el

more options

Hi,

Since 1-2 months my Firefox address bar grows vertically to about 1.5 its normal size when I click it. I think this came with an update. How can I disable this? It's really annoying and unnecessary.

Thanks

Hi, Since 1-2 months my Firefox address bar grows vertically to about 1.5 its normal size when I click it. I think this came with an update. How can I disable this? It's really annoying and unnecessary. Thanks

Isisombululo esikhethiwe

Hi MM6631764, this "focused" address bar is a new design in Firefox 75+. There is a built-in way to avoid enlargement when the cursor moves into the bar automatically, for example, on a new tab, but that doesn't prevent enlargement when you start interacting with the bar by clicking in it or typing in it. For that, the community has developed a workaround.

Restyling the Address Bar to Prevent Enlargement

In Firefox 78+, the only method to completely eliminate or limit the "enlargement" effect is to apply custom style rules using a userChrome.css file. I realize if it's your first UI hack, that all sounds like a foreign language. It's a little bit involved, so please set aside 10 quiet minutes to work through it.

(For anyone who already has a userChrome.css file set up, you just need to add the rules you downloaded under (A) to your file.)

(A) Download a rules file

https://www.userchrome.org/samples/userChrome-ZeroEnlargement.css

Use the downloads list on the toolbar to open the downloads folder directly to the new userChrome.css file. (See attached screenshot)

Minimize that file browser window for later reference.

(B) Create a new chrome folder in your profile folder

The following article has the detailed steps for that (#1, #2, and I recommend #3)

https://www.userchrome.org/how-create-userchrome-css.html

I have videos for both Windows and Mac in case the text is not clear.

(C) Move the userChrome-ZeroEnlargement.css file you downloaded in Step A into the chrome folder you created in Step B

(D) If you do not already have a userChrome.css file, Rename the userChrome-ZeroEnlargement.css file

Right-click userChrome-ZeroEnlargement.css and choose Rename. Carefully remove -ZeroEnlargement and press Enter to save your change. The final file name needs to be userChrome.css or Firefox will never find it.

(E) Set Firefox to look for userChrome.css at startup -- see step #6 in the above article.

The next time you exit Firefox and start it up again, it should discover that file and apply the rules.

Success?

Once you start tweaking the interface this way, you'll probably find more and more things you want to do. I suggest bookmarking the pages where you get the code for future reference because changes to Firefox may break them and it's easier to request an update if you can find the source.

Funda le mpendulo ngokuhambisana nalesi sihloko 👍 1

All Replies (8)

more options

Isisombululo Esikhethiwe

Hi MM6631764, this "focused" address bar is a new design in Firefox 75+. There is a built-in way to avoid enlargement when the cursor moves into the bar automatically, for example, on a new tab, but that doesn't prevent enlargement when you start interacting with the bar by clicking in it or typing in it. For that, the community has developed a workaround.

Restyling the Address Bar to Prevent Enlargement

In Firefox 78+, the only method to completely eliminate or limit the "enlargement" effect is to apply custom style rules using a userChrome.css file. I realize if it's your first UI hack, that all sounds like a foreign language. It's a little bit involved, so please set aside 10 quiet minutes to work through it.

(For anyone who already has a userChrome.css file set up, you just need to add the rules you downloaded under (A) to your file.)

(A) Download a rules file

https://www.userchrome.org/samples/userChrome-ZeroEnlargement.css

Use the downloads list on the toolbar to open the downloads folder directly to the new userChrome.css file. (See attached screenshot)

Minimize that file browser window for later reference.

(B) Create a new chrome folder in your profile folder

The following article has the detailed steps for that (#1, #2, and I recommend #3)

https://www.userchrome.org/how-create-userchrome-css.html

I have videos for both Windows and Mac in case the text is not clear.

(C) Move the userChrome-ZeroEnlargement.css file you downloaded in Step A into the chrome folder you created in Step B

(D) If you do not already have a userChrome.css file, Rename the userChrome-ZeroEnlargement.css file

Right-click userChrome-ZeroEnlargement.css and choose Rename. Carefully remove -ZeroEnlargement and press Enter to save your change. The final file name needs to be userChrome.css or Firefox will never find it.

(E) Set Firefox to look for userChrome.css at startup -- see step #6 in the above article.

The next time you exit Firefox and start it up again, it should discover that file and apply the rules.

Success?

Once you start tweaking the interface this way, you'll probably find more and more things you want to do. I suggest bookmarking the pages where you get the code for future reference because changes to Firefox may break them and it's easier to request an update if you can find the source.

more options

Alternatively try to add a preference ui.prefersReducedMotion = 1 to about:config.

more options

@jscher2000 @TyDraniu

Sorry for my delayed response. It's a shame that these hacks are apparently necessary but thanks both for your very helpful responses. I will check these out. Have a nice day :)

more options

The .css hack works :) I have one question though, does the enable toolkit.legacyUserProfileCustomizations.stylesheets pose any security risk? I'm always a bit wary to enable anything 'legacy'.

more options

MM6631764 said

The .css hack works :) I have one question though, does the enable toolkit.legacyUserProfileCustomizations.stylesheets pose any security risk? I'm always a bit wary to enable anything 'legacy'.

In recent versions, userChrome.css and userContent.css have been restricted so that scripts cannot be injected through them. Bad or obsolete style rules in those files still could break the user interface or web content, so be on the lookout for any strange modifications you didn't create yourself in case something is added to the chrome folder.

more options

Mmm doesn't sound too safe. Ok thanks for the info.

more options

Thanks @jscher2000. I already use userChrome and userContent styles, so your trick is just what I needed.

Hope Mozilla will give us an option to disable this in future versions of Firefox.

Okulungisiwe ngu Dominic Desbiens

more options

Firefox 63+ has support for "@media (prefers-reduced-motion)".

You can create a new Number pref named ui.prefersReducedMotion on the about:config page to show or block some animations.

In Firefox 78+ this includes the location bar breakout. In Firefox 80+ this replaces the tab loading indicator with an hourglass.

  • set the value to 1 if you want to block animations
    ui.prefersReducedMotion = 1
  • set its value to 0 if you want to see animations
    ui.prefersReducedMotion = 0

See also:

You can open the about:config page via the location/address bar. You can click the button to "Accept the Risk and Continue".