Merge Firefox Reload/Stop buttons, extensionless

Extensions are great but I love customizing Firefox without them. One of my favorite extensions is Stop/Reload, a simple extension that merges both buttons into a single one that toggles between stop and reload intelligently.

You can replicate this functionality with a simple edit of userChrome.css file. In Windows, you can find it at:

C:Documents and Settings[Your User name]Application DataMozillaFirefoxProfiles[obscure profile code followed by profile name]chrome

To find it in other platforms check Mozilla Knowledge Base. If it's not there, just rename the existing userChrome-example.css file to userChrome.css.

Then, add the following lines to the end of the file:

/* Show Stop and Reload buttons smartly*/

#stop-button[disabled] {    display: none;}

#stop-button:not([disabled]) + #reload-button {
    display: none;

Ensure that the Stop button is just before the Reload button in the toolbar. Now enjoy a more compact toolbar, a la Safari, a la Opera. 

16 thoughts on “Merge Firefox Reload/Stop buttons, extensionless”

  1. Cool idea, but it doesn’t quite work for me. The reload button always displays, and the stop button shows up beside it while a page is loading. I’ll poke at it tomorrow if nobody posts a solution before then. Maybe it has something to do with the fact that I’m using the iFox Graphite theme.

  2. Not too sure about it really. It assumes that the stop and reload buttons are mutually exclusive – that they could never be used at the same time. And there are times when both could be useful, so I’ll miss this.

    My Userchrome has in it:

    /*Find toolbar adjustment to show options in find-as-you-type*/
    #FindToolbar > * {display:-moz-box}

    /* Hide bookmark toolbar folder in bookmark menu*/
    menu[label=”Bookmarks Toolbar Folder”],
    menu[label=”Bookmarks Toolbar Folder”]+menuseparator {
    display: none !important;

    /* Remove Web Search from Tools Menu */
    menuitem[label=”Web Search”] { display: none; }
    menuitem[label=”Web Search”] + menuseparator { display: none; }

    /* Hide For Internet Explorer Users & Release Notes from Help Menu */
    menuitem[label=”For Internet Explorer Users”] { display: none; }
    menuitem[label=”Release Notes”] { display: none; }

    /* Less toolbar button spacing */
    toolbarbutton {
    padding: 3px !important;
    toolbarbutton[type=”menu-button”][disabled=”true”]:hover:active {
    padding: 0 !important;

    /*remove the Go button*/
    #go-button { display: none !important; }

    /* Remove the search-go-button and fix searchbar spacing */
    .search-go-button-stack {
    display: none !important;
    #search-container {
    margin-right: 7px !important;
    /*Resize search bar*/
    #search-container { width: 200px !important; }

    /*Menu icon (for Tiny Menu extension)*/
    menu#tinymenu {
    background: 50% 50% no-repeat
    menu#tinymenu > label {
    visibility: hidden;

  3. Pingback: Mezclar el boton detener/actualizar en Firefox | Baratijas Blog
  4. Thanks for the tip. It worked initially, after I’ve moved stop button on left side of reload button. But after restarting FF it started showing stop button every time reload button pressed, until I moved stop button to the right side and back to the left side…

    Using FF3.6

  5. @V@no: This article is over 4 years old. I believe it was Firefox 1.5 being discussed here; 2.0 at latest. The Firefox Chrome (GUI) has changed since then, and is about to change again in Firefox 4. What Percy wrote, and what Greg supplied later, can be scrapped and a new sollution is to be found. Likely, people at will post this sort of thing. My tutorial on the subject, ( ), explains how to use Stylish Firefox extension to do these sorts of things.

Comments are closed.