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 do I shorten the address bar?

  • 12 replies
  • 1 has this problem
  • 24 views
  • Last reply by cor-el

more options

see question

All Replies (12)

more options

Hi

Do you mean something like this (see attached screenshot)?

If so, click on the 3-bar (menu) icon/button > Customize and then add/drag and place "Flexible Space" after the last icon/button on your address bar. NOTE: You may need to add several "Flexible Space" in order to get the length that you prefer.

    B.R.
more options

What enclosed screenshot?

Where is 3-bar (menu) icon/button?

more options

Sorry, the screenshot is that little tiny image under my signature, but try this new one. I've encircled the 3-bar (menu) icon/button, then follow the steps in my first reply.

    B.R.
more options

You would need to install the Classic Theme Restorer extension to get the (flexible) space items in the Customize palette.


You can place the mouse pointer between the location bar and the search bar and it will become a resize icon that you can drag right or left with the left mouse button pressed to change the relative width of the two bars. Note that if you place the mouse pointer between the location bar and the search bar then the mouse pointer will change to a resize pointer that allows to change the width of the location and search bar by moving the mouse left or right. The total size stays the same and only the relative sizes change. You need to do that in normal mode (i.e. not in Customize mode).

more options

I installed the Restorer but when it comes to:

   You can place the mouse pointer between the location bar and the search bar and it will become a resize icon that you can drag right or left with the left mouse button pressed to change the relative width of the two bars.

placing the pointer does not do anything????

more options

marilyn said

I installed the Restorer but when it comes to:
You can place the mouse pointer between the location bar and the search bar and it will become a resize icon that you can drag right or left with the left mouse button pressed to change the relative width of the two bars.

placing the pointer does not do anything????

Hi marilyn, if you want to try it, there are a few steps:

(1) Using the Customize mode, drag the search bar to the left until it is just after the address bar. Then Exit Customize.

(2) Hover the mouse between the address bar and search bar and it should turn into a double-headed arrow. Then you can click and drag to the left to reduce the width of the address bar, which also increases the width of the search bar.

(3) Return to Customize to move the search bar back to the desired location.

more options

The search bar is in that mentioned position. While I was looking for the double arrow it does not appear. I will attempt to get back to this tonight but am not sure if I will be able to this evening as I have a sick dog. I will return to this issue asap. Thank you for your time.

more options

You can click the Restore Defaults button in the Customize palette to restore the default toolbar setup.

more options

Still wondering if there is a way to shorten the address bar????

more options

Add code to the userChrome.css file below the default @namespace line to set a maximun to the two bars on the Navigation Toolbar.


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

#urlbar-container { max-width: 400px !important; }
#search-container { max-width: 200px !important; }

The customization files userChrome.css (user interface) and userContent.css (websites) are located in the chrome folder in the Firefox profile folder.

You can use this button to go to the currently used Firefox profile folder:

  • Create the chrome folder (lowercase) in the <xxxxxxxx>.default profile folder if this folder doesn't exist
  • Use a plain text editor like Notepad to create a (new) userChrome.css file in the chrome folder (file name is case sensitive)
  • Paste the code in the userChrome.css file in the editor window
  • Make sure that the userChrome.css file starts with the default @namespace line
  • Make sure that you select "All files" and not "Text files" when you save the file via "Save file as" in the text editor as userChrome.css.
    Otherwise Windows may add a hidden .txt file extension and you end up with a not working userChrome.css.txt file
more options

The other suggestions I followed and those were not effective for one reason or another. This suggestion I hopefully followed correctly but seems to not do anything. Any other ideas?

more options

Can you post the file path of the userChrome.css file?

Did you verify that the file type is CSS file and not Text file in the properties of the file?

Can you post the content of the userChrome.css file?