Display back and forward buttons all the time in Firefox

Mozilla started to minimize the Firefox interface when Google Chrome started to gain traction. Recent versions of Firefox show only a single menu button, have done away with the status bar, merged the stop and reload button, and display the forward button only if there is a site in history that you can visit when you click on that button.

That's only the case if you hit the back button at least once, and even thought it may seem logical to only display the back button and not the forward button at all times because of it, I do prefer to see both buttons permanently in the interface as it means that the interface won't be changed dynamically in the browser.

It is also not really clear why Mozilla is only hiding the forward button, as the back button has no functionality as well initially.

It is relatively easy to add the forward button back to Firefox so that it is displayed next to the back button at all times. Let me show you how that is done:

• Load about:support in a tab in the Firefox web browser or select Firefox > Help > Troubleshooting Information from the menu.
• Locate the profile folder entry and click on the Show Folder button. This should open the Firefox profile folder in the default file browser of the system.
• Check if there is a Chrome directory here. If not, create it.
• Open the Chrome directory and see if you have a userChrome.css file there. If not, create it.
• Open the userChrome.css file and add the following lines of code to the end of it:

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
@-moz-document url(chrome://browser/content/browser.xul) {
window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] > :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) > #unified-back-forward-button[forwarddisabled] + #urlbar-container > #urlbar {
margin-left: 0px !important;
border-left: 1px solid #b4c2cf !important;
}

window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] > :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) > #unified-back-forward-button:not(:hover) > #forward-button[disabled] ,
window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] > :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) > #unified-back-forward-button:hover > #forward-button[disabled] {
opacity: 1.0 !important;
margin-right: -2px !important;
}

window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] > :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) > #unified-back-forward-button > #forward-button[disabled] > .toolbarbutton-icon{
border-top:1px solid #869aad !important;
border-bottom:1px solid #869aad !important;
}

window:not([chromehidden~=toolbar]) #navigator-toolbox[iconsize=large][mode=icons] > :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"],#nav-bar:not([currentset])) > #unified-back-forward-button[forwarddisabled] #back-forward-dropmarker{
visibility:visible !important;
}
}

• Restart Firefox afterwards.

You should now see both a back and forward button in Firefox's interface. (via Horst and MozillaZine.