Move the tab bar - Firefox: Difference between revisions

From MozillaZine Knowledge Base
Jump to navigationJump to search
(Firefox 4.0 offers choice of tabs on top or on bottom of toolbars)
 
(13 intermediate revisions by 9 users not shown)
Line 1: Line 1:
Use the ChromEdit extension to edit your userChrome.css file to add the code you need, as follows.
Edit your [[userChrome.css]] file to add the code you need, as follows.


===Move it to the Bottom===
/* Display the tabbar at the bottom */
  /* Display the tabbar at the bottom */<br>
#content > tabbox { -moz-box-direction: reverse; }
  &#35;content > tabbox {-moz-box-direction: reverse;}


===Move it to the Left/Right Sides===
===Move it to the Left/Right Sides===
  /* Display the tabbar on the left */<br>
/* Display the tabbar on the left */
  &#35;content > tabbox {
#content > tabbox {
    -moz-box-orient: horizontal;
  -moz-box-orient: horizontal;
   }
}
.tabbrowser-strip {
  -moz-box-orient: vertical;
  /* note: you can set this to -moz-scrollbars-vertical instead,
      but then the scrollbar will *always* be visible.  this way
      there is never a scrollbar, so it behaves like the tab bar
      normally does */
  overflow: -moz-scrollbars-none;
}
.tabbrowser-tabs {
  -moz-box-orient: horizontal;
  min-width: 10ex;   /* you may want to increase this value */
  -moz-box-align: start;
}
.tabbrowser-tabs > hbox {
  -moz-box-orient: vertical;
  -moz-box-align: stretch;
}
.tabbrowser-tabs > hbox > tab {
  -moz-box-align: start;
  -moz-box-orient: horizontal;
}
/* remove the close-tab button */
.tabbrowser-tabs > stack {
  display: none;
}


  .tabbrowser-strip {
If you want to move it to the right, add the following lines to the above:
    -moz-box-orient: vertical;
/* Instead, display the tabbar on the right */
    /* note: you can set this to -moz-scrollbars-vertical instead,
#content > tabbox { -moz-box-direction: reverse; }
      but then the scrollbar will *always* be visible.  this way
      there is never a scrollbar, so it behaves like the tab bar
      normally does */
    overflow: -moz-scrollbars-none;
  }


  .tabbrowser-tabs {
Unabashedly stolen from [http://forums.mozillazine.org/viewtopic.php?p=238798#238798 clav].
    -moz-box-orient: horizontal;
    min-width: 10ex;  /* you may want to increase this value */
    -mox-box-pack: start;
    -moz-box-align: start;
  }


  .tabbrowser-tabs > hbox {
    -moz-box-orient: vertical;
    -moz-box-align: stretch;
    -moz-box-pack: start;
  }


  .tabbrowser-tabs > hbox > tab {
Note that this does not work for Firefox 2.0b2 and newer.
    -moz-box-align: start;
    -moz-box-orient: horizontal;
  }


  /* remove the close-tab button */
==Firefox 4.0 and above==
  .tabbrowser-tabs > stack {
The Tab bar will be at the top of the toolbars by default.  To move the Tab bar back down below the Location bar use as in previous versions -- View (Alt+V) menu -> uncheck "Tabs on Top"
    display: none;
  }


If you want to move it to the right, add the following lines to the above:<br>
[[Category:Visual customizations (Firefox)]]
  /* Instead, display the tabbar on the right */<br>
[[Category:Tabbed browsing]]
  &#35;content > tabbox {-moz-box-direction: reverse;}
 
Unabashedly stolen from [http://forums.mozillazine.org/viewtopic.php?p=238798#238798 clav].

Latest revision as of 11:34, 2 September 2010

Edit your userChrome.css file to add the code you need, as follows.

/* Display the tabbar at the bottom */

  1. content > tabbox { -moz-box-direction: reverse; }

Move it to the Left/Right Sides

/* Display the tabbar on the left */
#content > tabbox {
  -moz-box-orient: horizontal;
}

.tabbrowser-strip {
  -moz-box-orient: vertical;
  /* note: you can set this to -moz-scrollbars-vertical instead,
     but then the scrollbar will *always* be visible.  this way
     there is never a scrollbar, so it behaves like the tab bar
     normally does */
  overflow: -moz-scrollbars-none;
}

.tabbrowser-tabs {
  -moz-box-orient: horizontal;
  min-width: 10ex;   /* you may want to increase this value */
  -moz-box-align: start;
}

.tabbrowser-tabs > hbox {
  -moz-box-orient: vertical;
  -moz-box-align: stretch;
}

.tabbrowser-tabs > hbox > tab {
  -moz-box-align: start;
  -moz-box-orient: horizontal;
}

/* remove the close-tab button */
.tabbrowser-tabs > stack {
  display: none;
}

If you want to move it to the right, add the following lines to the above:

/* Instead, display the tabbar on the right */
#content > tabbox { -moz-box-direction: reverse; }

Unabashedly stolen from clav.


Note that this does not work for Firefox 2.0b2 and newer.

Firefox 4.0 and above

The Tab bar will be at the top of the toolbars by default. To move the Tab bar back down below the Location bar use as in previous versions -- View (Alt+V) menu -> uncheck "Tabs on Top"