CustomCSSforFx
CustomCSSforFx copied to clipboard
Padding Above the Tabs is Back in FF v101
- Issue description:
Starting from Firefox v101, the padding above the tabs (between top of tabs and top of browser) is back while using the latest version of CustomCSSforFx.
- Does the issue occur with latest CustomCSSforFx release?
Yes, tested with 4.1.8v3.
- Steps to reproduce the issue:
- Update to Firefox v101. - Use CustomCSSforFx 4.1.8v3 with default configuration.
-
SCREENSHOT(S) of the issue (drag & drop images into this post):
-
Is 'about:config > toolkit.legacyUserProfileCustomizations.stylesheets' set to 'true'?
Yes.
- System information
- OS & OS version: Windows 10 21H1 x64
- DPI / HiDPI (e.g. 100%, 125%...): 100%
- Firefox version: 101.0.1 (64-bit)
- Firefox theme (e.g. default, dark, 'theme name & link'): default
- This projects userChrome.css/userContent.css 'settings' the issue occurs with: default
Test https://github.com/Aris-t2/CustomCSSforFx/releases/tag/4.1.9pre
@Aris-t2 The test build solved the problem; than you for the very quick fix. 😄
This fixes it for me too. I noticed the min/max/close buttons on Windows 10 are a bit too close to the top/right position
@Aris-t2 thanks
I'm guessing whatever change you did with this now causes the tabs text to shift upward when moving tabs around? Was working fine before with v4.1.8, noticed this new behavior when I updated to 4.1.9.
The recent tab changes are using this code:
/* Fx 101+ */
#main-window[sizemode="maximized"][tabsintitlebar] #titlebar {
margin-top: -5px !important;
}
#main-window[sizemode="fullscreen"][tabsintitlebar] #titlebar {
margin-top: -3px !important;
}
#main-window[sizemode="maximized"][tabsintitlebar] #toolbar-menubar {
padding-top: 5px !important;
}
Any chance you post a screenshot of the environment this change causes the mentioned issue for you.
Edit:
Are you using Win7 or 8? Just found out the about changes are only needed for Win 10 & 11 on Fx 101+.
A screenshot probably won't do, so I made a pretty bad gif instead, you'll have to look close, but once you "release" a tab you'll see how the text all kinda shifts upward. (I'm on Win10 / FF101.1, btw)
@ImSpecial I had no luck to reproduce this glitch on Windows 10 (Fx 101) or 11 (Fx 103).
Could you edit default_tabs_photon.css
file and remove the change for 101+ at the bottom of it?
This was the only change for photon tabs between 4.1.8 and 4.1.9
Did you modify the tab height somewhere in this projects files? In my tests even a height of 24px did not cause this glitch when set inside general_variables.css. It might also be button/icon related. Did you move any buttons to tabs toolbar or removed the default ones?
Weird, so I was able to fix this but it wasn't some custom code or anything...
In Firefox's own Customization menu, there is a "New Tab" button, I removed it off the bar and now all tabs move around perfectly afterwards, adding the button back causes the same "glitch" to happen like shown in my gif.
https://i.imgur.com/nHVyFvq.png https://i.imgur.com/Q1BJ7N7.png https://i.imgur.com/NXnSc4p.png
I'm kinda torn on this, I like the button there, but hate this glitch, is there a way to fix this? I'll deal either way, but maybe (and hoping) there's a simple tweak one can do.
I know this is a bit old but the issue is still here, is there a way I can shrink the "New Tab" button with some css? Like 10 or 15%, or maybe just reduce the height by a few pixels to see if it helps?
Sorry, I forgot to respond here.
Try this:
#TabsToolbar #tabs-newtab-button .toolbarbutton-icon {
padding: 0 !important;
height: 16px !important;
width: 16px !important;
}
No change in the behavior unfortunately, in fact the button doesn't seem to look any different either in size or padding, etc. even with crazy numbers like "height: 56px" or "width: 1px"
I'm not sure what causes the size not to be changeable for you. Maybe testing a new /chrome/ setup might give you clue?
I think we can close this for now. If the issue is still present with latest release, feel free to post here. I will reopen this thread again.
It still happens with 4.2.1 if the "add tab" button is on the same bar as the tabs, I've never been able to fix it other then just removing the tab button, or moving it to somewhere else, "my" fix was to just remove the button, and have already kinda just gotten used to not having it now. it's a mystery...
I did notice that when the "add tab" button is on the tab bar it has a different graphic vs if it's somewhere else, weird.
one tab bar: https://i.imgur.com/tJ15xL5.png
Same button but moved: https://i.imgur.com/EpI4Hq9.png
@ImSpecial Could you start a new Portable Firefox setup and recreate the issue there?
Upload the full Portable Firefox archive to Google drive or https://www.upload.ee or https://www.mediafire.com or something similar.
@ImSpecial
Tests from today could still not reproduce your issue.
(started with default setup)
userChrome.css
- disabled
icons_colorized.css
- disabled
buttons_on_navbar_classic_appearance.css
- disabled
classic_squared_tabs.css
- enabled
default_tabs_photon.css
- enabled
tabs_below_navigation_toolbar.css
general_variables.css
- enabled and set
--tab-min-height: 24px !important;
General
- switched to dark theme
- tested compact and normal modes
- tested OS titlebar and Firefox titlebar (-> customizing mode)
Sorry to keep you waiting, yes I can reproduce using a clean userChrome setup, with ALL custom code removed, only yours, but honestly I just don't care about this anymore to try and figure it out... and I don't want you to waste any time on it either, if you say all's good, then I'm just going to assume it's a weird DPI issue, graphics driver, or something else "my computer", that makes it this way...
Short of just uploading my userChrome folder to you to plug in a try... but again I just removed the button and all is good. :)
You should probably/can close this topic now. :P
OK, I will close it. Feel free to open a new issue about this, if you want.