Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Natao arisiva ity resaka mitohy ity. Mametraha fanontaniana azafady raha mila fanampiana.

how to stop bars from moving when moving tabs?

  • 6 valiny
  • 1 manana an'ity olana ity
  • 9 views
  • Valiny farany nomen'i qwerty123z

more options

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.

I am using Firefox 57.0.4 I moved my tabs to the bottom using what's shown below in userChrome: <pre><nowiki>/* 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; }</nowiki></pre> 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.

Novain'i cor-el t@

Vahaolana nofidina

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;
}
Hamaky an'ity valiny ity @ sehatra 👍 1

All Replies (6)

more options

Try to add this rule to see if that makes a difference.

:root {
  --tab-toolbar-navbar-overlap: 0px !important;
}
more options

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.

Novain'i qwerty123z t@

more options

Screen of the error?

more options

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.

more options

Vahaolana Nofidina

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;
}
more options

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.