Firefox navigation bar at the bottom

Support
, ,
1

hi,
I am a notebook user and like surfing through the web with it. At the moment, I use the Vivaldi browser, because I am not able to find any firefox based browser, which provides me the option to have the navigation bar at the bottom on a desktop computer system. On my android phone, I use fennec (Firefox based browser), which has understood the useful option and of course let me choose to have it at the bottom. On my notebook, where I mostly look down with my eyes, when I put it on my legs or on a table with usual height, it of course only makes sense to have all non website content at the bottom including the navigation bar. The result is, that the content, my eyes most time am staring at, moves a little higher which makes me having a little more comfortable feeling. But for now, I have only found Vivaldi… It’s a great and genius browser, but I love to use Firefox too.

Screenshot_20201123_162756
Screenshot_20201123_1627561920×1080 182 KB

By searching through the web, I found out, that indeed Firefox was able to move the navigation bar to the bottom, but it’s unclear for me, why they removed that really useful option.

My question now is, wether anybody knows a firefox based opensource desktop browser, which can provide the bottom navigation bar? I already searched the web alot, but without success. :disappointed_relieved:

2

from Firefox support

tabbar location

3

Hi @SLaItEr,
thank you for the link. I read a little bit of the description and am pretty sure that this commands just moves the tabs under the navigation bar, which though is still at the top of the screen area. Please correct me, when I am wrong.

4

@notone,

There is a way via userChrome.css styling. Not that pretty, but it works.

You can try the following steps:

  1. Navigate to about:support
  2. Open your Profile Directory
  3. Create a folder named chrome, if it do not exists
  4. Create a file userChrome.css
  5. Open about:config
  6. Change toolkit.legacyUserProfileCustomizations.stylesheets to true
  7. Close FireFox
  8. Paste this into the userChrome.css 
@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

#browser {
	-moz-box-ordinal-group: 0 !important;
	padding-top: 1px;
}

#nav-bar[inFullscreen],
#TabsToolbar[inFullscreen] {
	display: none;
}
  1. Start Firefox and Voila!
1 Like
5

@CyberOto,
thank you for the great description!! Now it looks like that :laughing:

Screenshot_20201123_185307
Screenshot_20201123_1853071920×1080 334 KB

hmm, I will try to work with that, although I have to be very patient now, not to hit the close button when scrolling :face_with_hand_over_mouth:

But that’s the best solution for now!! You know how to code :smiley: :+1:

If somebody find some better solution or qualified browser, please tell me!

6

You can add this code to hide the buttons and add extra drag space before and after the tabs. Adjust to your liking.

#TabsToolbar > .titlebar-buttonbox-container {
	display: none !important;
}

.titlebar-spacer[type="pre-tabs"],
.titlebar-spacer[type="post-tabs"] {
    width: 40px;
}
1 Like
7

If you want to dig look further, this is a good place to start

1 Like
8

Thank you again! :grin: At the moment, I don’t have so many time to try programming. But you already helped alot!!! I keep my firefox as in your first post. When I find a better solution, I will write it here.

9