how to stop bars from moving when moving tabs?
I am using Firefox 57.0.4
I moved my tabs to the bottom using what's shown below in userChrome:
/* Tab bar below Navigation & Bookmarks Toolbars */ #nav-bar { /* main toolbar */ -moz-box-ordinal-group: 1 !important; box-shadow: none !important; border-top-width: 0 !important; } #PersonalToolbar { /* bookmarks toolbar */ -moz-box-ordinal-group: 2 !important; } #TabsToolbar { /* tab bar */ -moz-box-ordinal-group: 3 !important; padding-top: 0 !important; } /* Clean up spacing */ .titlebar-placeholder { display: none !important; }
When I try to move one of my tabs the bars above it move up slightly. Is there a way to stop the bars above my tabs from moving when I move one of my tabs?
I couldn't upload images when creating this post, so I uploaded the problem in imgur: https://imgur.com/a/BjOoR
If you notice in the second picture the address bar is overlapping the menu bar.
Ändrad
Vald lösning
Wow, I never noticed that before. This is caused by the following built-in style rules:
/* The next 3 rules allow dragging tabs slightly outside of the tabstrip * to make it easier to drag tabs. */ #TabsToolbar[movingtab] { padding-bottom: 15px; } #TabsToolbar[movingtab] > .tabbrowser-tabs { padding-bottom: 15px; margin-bottom: -15px; } #TabsToolbar[movingtab] + #nav-bar { margin-top: -15px; pointer-events: none; }
To override those, try:
/* Override vertical shifts when moving a tab */ #TabsToolbar[movingtab] { padding-bottom: 0 !important; } #TabsToolbar[movingtab] > .tabbrowser-tabs { padding-bottom: 0 !important; margin-bottom: 0 !important; } #TabsToolbar[movingtab] + #nav-bar { margin-top: 0 !important; }Läs svaret i sitt sammanhang 👍 1
Alla svar (6)
Try to add this rule to see if that makes a difference.
:root { --tab-toolbar-navbar-overlap: 0px !important; }
cor-el said
Try to add this rule to see if that makes a difference.:root { --tab-toolbar-navbar-overlap: 0px !important; }
Thanks for the reply, I tried that but it didn't change anything/work.
Ändrad
Screen of the error?
WestEnd said
Screen of the error?
I posted it in my imgur link since the picture wasn't uploading on here at the time of my post. I just uploaded the pictures again in this post.
In the pictures if you look at the nav-bar. One of the pictures will appear fine but when I try moving a tab around the nav-bar will move up and overlap a bit of the menu buttons.
Vald lösning
Wow, I never noticed that before. This is caused by the following built-in style rules:
/* The next 3 rules allow dragging tabs slightly outside of the tabstrip * to make it easier to drag tabs. */ #TabsToolbar[movingtab] { padding-bottom: 15px; } #TabsToolbar[movingtab] > .tabbrowser-tabs { padding-bottom: 15px; margin-bottom: -15px; } #TabsToolbar[movingtab] + #nav-bar { margin-top: -15px; pointer-events: none; }
To override those, try:
/* Override vertical shifts when moving a tab */ #TabsToolbar[movingtab] { padding-bottom: 0 !important; } #TabsToolbar[movingtab] > .tabbrowser-tabs { padding-bottom: 0 !important; margin-bottom: 0 !important; } #TabsToolbar[movingtab] + #nav-bar { margin-top: 0 !important; }
jscher2000 said
Wow, I never noticed that before. This is caused by the following built-in style rules:/* The next 3 rules allow dragging tabs slightly outside of the tabstrip * to make it easier to drag tabs. */ #TabsToolbar[movingtab] { padding-bottom: 15px; } #TabsToolbar[movingtab] > .tabbrowser-tabs { padding-bottom: 15px; margin-bottom: -15px; } #TabsToolbar[movingtab] + #nav-bar { margin-top: -15px; pointer-events: none; }To override those, try:
/* Override vertical shifts when moving a tab */ #TabsToolbar[movingtab] { padding-bottom: 0 !important; } #TabsToolbar[movingtab] > .tabbrowser-tabs { padding-bottom: 0 !important; margin-bottom: 0 !important; } #TabsToolbar[movingtab] + #nav-bar { margin-top: 0 !important; }
Thank you, this solved it.