userstyles VS firefox-csshacks

I am using userChrome.css to move the URL bar to the bottom of the screen, the bookmarks bar on top of it, and then the browser window on top of that. I use the stylesheet by Arty2 and a couple of modifications:

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul); /* https://github.com/Arty2/userstyles @version 0.2.2 1. Find your profile folder `about:support > Profile Folder > Open Folder` or locate the exact profile in use by visiting `about:profiles`. 2. Create a folder named `chrome` then create a file named userChrome.css inside it and paste the following code. 3. If userChrome.css doesn’t seem to work, open `about:config` and set `toolkit.legacyUserProfileCustomizations.stylesheets=true`. 4. Restart Firefox. Other references: Firefox Support forum - Tabs below the URL bar: https://support.mozilla.org/en-US/kb/forum-response-tabs-below-url-bar Custom CSS tweaks for Firefox Quantum: https://github.com/Aris-t2/CustomCSSforFx */ /* tabs to bottom source: https://github.com/Arty2/userstyles/blob/master/tabs_to_bottom.userchrome.css UI model: #navigator-toolbox-background #navigator-toolbox #titlebar #toolbar-menubar #TabsToolbar #nav-bar #PersonalToolbar #browser */ /* bring the browser window to the top */ #browser { -moz-box-ordinal-group: 0 !important; } /* adjust paddings */ *|*:root[sizemode="maximized"] #TabsToolbar { /* a bug prohibits removing top paddint of #titlebar */ margin-top: -8px !important; } *|*:root[sizemode="maximized"] #browser { padding-top: 8px !important; } *|*:root[sizemode="normal"] #browser { padding-top: 0 !important; } /* hide tab toolbar when fullscreen */ #nav-bar[inFullscreen], #TabsToolbar[inFullscreen] { display: none; } /* restore top border */ /*TODO: find the proper color variable, it's not -moz-accent-color*/ *|*:root[sizemode="normal"] #browser { border-top: 1px solid #4d4d50 !important; } /* make toolbar border persist on fullscreen */ *|*:root[sizemode="maximized"] #navigator-toolbox { border-top: 1px solid -moz-accent-color !important; border-bottom: 1px solid -moz-accent-color !important; } /* hide titlebar buttons */ #TabsToolbar > .titlebar-buttonbox-container { display: none !important; }

Not aware there was a "Mac version" of MrOtherGuy's 'tabs_on_bottom.css' userstyle... or are you using another userstyle from another author?

https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/autohide_toolbox.css (edited)

/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */

I'm trying to create a flexible status text toolbar item like used to exist (here's an example from my current setup in Pale Moon), which I can place into the "status bar" that I created using MrOtherGuy's "fake status bar w bookmarkbar" code.

I can't figure out how to solve the issue even though I found a possible culprit, it might be related to the tabs full width code.

/* address bar on pop-ups - based on https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/show_toolbars_in_popup_windows.css */ :root[chromehidden~="toolbar"] :is( /* .browser-toolbar, */ #nav-bar, #urlbar-container, .chromeclass-toolbar-additional ) { display: flex !important; /* visibility: visible !important; */ }

You might want to check out styles that have been updated recently, like those.