Problem with auto-hide.css

[LOuroboros]

I checked this on Windows 7 Professional x64 and Windows 8.1 Professional x64 too.
If I use the code from auto-hide.css, this is the result I get:

That strange white bar that appears alongside the Google tab is actually a part of the webpage I'm visiting, Google.

If I modify it in the same way mentioned by @lokmeinmatz right here, Firefox on Fullscreen does look correct, as you can see right below:

Note: I had to modify the amount of pixels from 7 to 5 for Firefox to look correct on my end.
I suppose that might depend on the user's desktop resolution? Mine's 1360x768, in case that matters.

But then the problem becomes the Windowed mode, as you can see here, with a strange black bar showing up:

As a matter of fact, I noticed that on Windows 7 the issue is not present if you turn off Aero. Sadly, that is something you can't just do in Windows 8/10, because it breaks a lot of stuff.

EDIT: Oh yes, I am using Mozilla Firefox v68.0.2 x86, by the way.

[ana-ka]

Yep, I can confirm this and in fact noticed it some time ago. This particular issue appeared with FF67 I think. Also it is present in 69 as well. Just didn't bother to report since this repo seems rather dead. :( There have been issues with auto-hide since a while. Sadly I have neither time nor skills to dig into this myself and it appears noone else has, too. Let's see what happens...

[sans-c]

Starting with the latest Firefox release 72.0, the location bar wont show up anymore. I had the problems described above earlier but it was still somewhat usable. In FF72 however, the location bar is gone for good. I'd appreciate any fixes/ideas, other than reverting to the default configuration.

If anyone needs any more information, let me know.

edit: found a soltuion that works for me via reddit. Tested with compact mode, both in window and fullscreen using FF72. I slightly changed the transitions compared to the reddit solution which felt too slow to me. My whole userChrome.css now looks like this:

#nav-bar:not([customizing="true"]):not([inFullscreen]) {
	min-height: 1px !important;
	max-height: 0px !important;
	margin-top: 1px !important;
	margin-bottom: -1px !important;
	transition: all 50ms linear 0s !important;
	z-index: -5 !important;
}

#navigator-toolbox:hover:not([inFullscreen]) :-moz-any(#nav-bar),
#navigator-toolbox:focus-within :-moz-any(#nav-bar) {
	min-height: 32px !important;
	max-height: 32px !important;
	margin-top: 1px !important;
	margin-bottom: -32px !important;
	transition: all 50ms linear 0s !important;
	z-index: 5 !important;
}

Maybe that helps. :)