Firefox... taming the beast part 2 !!

Anak said:

It took a bit of doin' but I have TOB or tob (tabs on bottom) and no horzon-bar. . .

Though one 'thing', Could you point me to the code to increase the spacing between the bookmarks toolbar and the tabs? I have problems with translating what the code says to behavior of the browser.

Attachment 379649

I'm not exactly sure what you're talking about.
But the easiest way to get that spacing, is just use my Chrome folder (4.20) updated in first post.
And use my about:config settings. Then do your own tweaks from there.

Here's what my whole browser looks like. What does your whole browser look like?





Or... here is the code for the buttons and tabs in my userChrome.css
You can compare it to yours?

Code:

/* ==========================================
   TOOLBAR BUTTONS (shape, appearance, icons)
   ==========================================
*/

/* ---------------
   ICON APPEARANCE
   --------------- 
   
   [!] only use one option at a time
   [!] custom icon quality does not increase in HiDPI modes
*/

@import "./css/buttons/icons_colorized.css"; /**/
/* @import "./css/buttons/icons_white_icons.css"; /**/
/* @import "./css/buttons/icons_custom_icons.css"; /**/  
/* @import "./css/buttons/icons_custom_icons_fx1.css"; /**/
/* @import "./css/buttons/icons_custom_icons_fx2.css"; /**/
/* @import "./css/buttons/icons_custom_icons_fx3.css"; /**/
/* @import "./css/buttons/icons_custom_icons_fx3strata.css"; /**/
/* @import "./css/buttons/icons_custom_icons_fx12_colorized.css"; /**/
/* @import "./css/buttons/icons_custom_icons_crystal.css"; /**/
/* @import "./css/buttons/icons_custom_icons_firebird.css"; /**/
/* @import "./css/buttons/icons_custom_icons_kempelton.css"; /**/
/* @import "./css/buttons/icons_custom_icons_noia.css"; /**/
/* @import "./css/buttons/icons_custom_icons_ie6.css"; /**/
/* @import "./css/buttons/icons_custom_icons_seamonkey.css"; /**/
/* @import "./css/buttons/icons_custom_icons_old_chrome.css"; /**/
/* @import "./css/buttons/icons_custom_icons_old_osx.css"; /**/
/* @import "./css/buttons/icons_custom_icons_tango.css"; /**/
@import "./css/buttons/icons_custom_icons_fx45.css"; /**/
/* @import "./css/buttons/icons_custom_icons_fx45_inverted.css"; /**/


/* -----------------
   BUTTON APPEARANCE
   -----------------
*/

/* 'Classic' pre-Proton button padding */
/* @import "./css/buttons/classic_button_padding.css"; /**/


/* -------------------------------------
   Navigation toolbar buttons appearance
   -------------------------------------
   
   [!] only use one option at a time
   [!] good for Dark themes: buttons_on_navbar_classic_appearance_dark.css
   [!] good for Dark themes: buttons_on_navbar_glass_appearance.css
*/

/* @import "./css/buttons/buttons_on_navbar_classic_appearance.css"; /**/
@import "./css/buttons/buttons_on_navbar_classic_appearance_v2.css"; /**/
/* @import "./css/buttons/buttons_on_navbar_classic_appearance_dark.css"; /**/		
/* @import "./css/buttons/buttons_on_navbar_aero_appearance.css"; /**/
/* @import "./css/buttons/buttons_on_navbar_windows_classic_theme_appearance.css"; /**/
/* @import "./css/buttons/buttons_on_navbar_glass_appearance.css"; /**/
/* @import "./css/buttons/buttons_on_navbar_osx_appearance.css"; /**/


/* -------------------------------------
   Navigation toolbar buttons: roundness
   -------------------------------------
   
   [!] edit file to set roundness
*/

/* @import "./css/buttons/buttons_on_navbar_button_roundness.css"; /**/


/* -----------------------------
   Squared buttons / button size
   -----------------------------
   
   [!] edit file to set roundness
*/

/* 'rectangular shape' - normal size */
/* @import "./css/buttons/buttons_on_navbar_squared_buttons.css"; /**/

/* 'normal shape' - large size (huge 48x48px buttons with 36x36px icons)
   [!] EXPERIMENTAL
   [!] not compatible with 'custom icon' options
   [!] not compatible with 'custom back & forward buttons' appearance options
   [!] not compatible with 'text mode' option
   [!] partly compatible with 'icons+text' option, if in 'compact mode'
*/
/* @import "./css/buttons/buttons_on_navbar_huge_48px_size.css"; /**/

/* smaller button spaces in 'compact' mode - 'Classic Toolbar Buttons' add-ons 'small' mode
   [!] 'compact mode' got hidden behind the about:config preference browser.compactmode.show 
*/
/* @import "./css/buttons/buttons_on_navbar_more_compact_mode.css"; /**/


/* ------------------------------------
   Bookmarks toolbar: button appearance
   ------------------------------------
   
   [!] only use one option at a time
   [!] Windows 7-10 only: buttons_on_bookmarks_toolbar_old_size_and_appearance.css
*/

/* @import "./css/buttons/buttons_on_bookmarks_toolbar_classic_appearance.css"; /**/
/* @import "./css/buttons/buttons_on_bookmarks_toolbar_classic_appearance_dark.css"; /**/
/* @import "./css/buttons/buttons_on_bookmarks_toolbar_aero_appearance.css"; /**/
/* @import "./css/buttons/buttons_on_bookmarks_toolbar_old_size_and_appearance.css"; /**/


/* ---------------------------------------------
   Bookmarks toolbar: bookmarks items appearance
   ---------------------------------------------
   
   [!] only use one option at a time
*/

/* @import "./css/buttons/buttons_on_bookmarks_toolbar_classic_appearance_items.css"; /**/
/* @import "./css/buttons/buttons_on_bookmarks_toolbar_classic_appearance_items_dark.css"; /**/
/* @import "./css/buttons/buttons_on_bookmarks_toolbar_aero_appearance_items.css"; /**/


/* -------------------------------
   Menu toolbar: button appearance
   -------------------------------
*/

/* @import "./css/buttons/buttons_on_menubar_toolbar_classic_appearance.css"; /**/


/* -------------------------------
   Tabs toolbar: button appearance
   -------------------------------
   
   [!] EXPERIMENTAL
*/

/* @import "./css/buttons/buttons_on_tabs_toolbar_classic_appearance.css"; /**/


/* ---------------------------------------------------
   Bookmarks menu button - 'button & popup' appearance
   ---------------------------------------------------
*/

@import "./css/buttons/bookmarks_menu_button_localized_label_on_bookmarks_toolbar.css"; /**/
/* @import "./css/buttons/bookmarks_menu_button_popup_showall_top_hidden.css"; /**/
/* @import "./css/buttons/bookmarks_menu_button_popup_showall_bottom_hidden.css"; /**/
/* @import "./css/buttons/bookmarks_menu_button_popup_sidebar_item_hidden.css"; /**/
/* @import "./css/buttons/bookmarks_menu_button_popup_toolbar_item_hidden.css"; /**/
/* @import "./css/buttons/bookmarks_menu_button_popup_other_item_hidden.css"; /**/


/* ----------------------
   Other buttons settings
   ----------------------
*/

@import "./css/buttons/whatnew_button_always_hidden.css"; /**/
/* @import "./css/buttons/forward_button_hide_when_disabled.css"; /**/
/* @import "./css/buttons/back_and_forward_separated_history_popups.css"; /**/
/* @import "./css/buttons/back_and_forward_leftclick_history_popup_hidden.css"; /**/
/* @import "./css/buttons/zoom_buttons_hide_reset.css"; /**/
/* @import "./css/buttons/overflow_button_rotate_on_open.css"; /**/


/* ----------------------------------------
   CUSTOM BACK & FORWARD BUTTONS appearance
   ----------------------------------------
   
   [!] only use one option at a time
*/

/* @import "./css/buttons/custom_backforward_large_ff2.css"; /**/
/* @import "./css/buttons/custom_backforward_large_ff3.css"; /**/
/* @import "./css/buttons/custom_backforward_large_ff3_strata.css"; /**/
/* @import "./css/buttons/custom_backforward_large_ff3_strata_v2.css"; /**/
/* @import "./css/buttons/custom_backforward_large_ff3_strata_orange.css"; /**/
/* @import "./css/buttons/custom_backforward_large_ff3_strata_red.css"; /**/
/* @import "./css/buttons/custom_backforward_large_ie8.css"; /**/
/* @import "./css/buttons/custom_backforward_large_ie9.css"; /**/
/* @import "./css/buttons/custom_backforward_large_kempelton.css"; /**/
/* @import "./css/buttons/custom_backforward_large_noia.css"; /**/
/* @import "./css/buttons/custom_backforward_small_ff3.css"; /**/
/* @import "./css/buttons/custom_backforward_small_ff3_strata.css"; /**/
/* @import "./css/buttons/custom_backforward_small_ff3_strata_orange.css"; /**/
/* @import "./css/buttons/custom_backforward_small_ff3_strata_red.css"; /**/
/* @import "./css/buttons/custom_backforward_small_ie8.css"; /**/
/* @import "./css/buttons/custom_backforward_small_ie9.css"; /**/
/* @import "./css/buttons/custom_backforward_small_kempelton.css"; /**/
/* @import "./css/buttons/custom_backforward_connected.css"; /**/ /* round */
/* @import "./css/buttons/custom_backforward_connected_to_location_bar.css"; /**/ /* round */
/* @import "./css/buttons/custom_backforward_connected_alt.css"; /**/ /* squared*/
/* @import "./css/buttons/custom_backforward_connected_to_location_bar_alt.css"; /**/ /* squared*/


/* ==========================================
   APPLICATION / HAMBURGER / MAIN MENU BUTTON
   ==========================================
*/


/* -----------------------------------
   Application/hamburger button hidden
   -----------------------------------
   
   [!] disable all other appbutton options when using this option
*/

@import "./css/appbutton/appbutton_hidden.css"; /**/


/* ----------------------------------
   Application/hamburger button popup
   ----------------------------------
*/

@import "./css/appbutton/appbutton_popup_icons.css"; /**/
@import "./css/appbutton/appbutton_popup_icons_colorized.css"; /**/
/* @import "./css/appbutton/appbutton_popup_sync_hidden.css"; /**/
/* @import "./css/appbutton/appbutton_popup_logins_and_passwords_hidden.css"; /**/


/* ----------------------------------------------------------------
   Application / hamburger / main menu button on navigation toolbar
   ----------------------------------------------------------------

   [!] disable all 'button in Firefox titlebar' options for
       'button on navigation toolbar' options to work properly
*/


/* -----------------------------------
   Button on navigation toolbars start
   -----------------------------------
*/

/* @import "./css/appbutton/appbutton_on_navbar_start_position.css"; /**/


/* -----------------------------------
   Button on navigation toolbar: color
   -----------------------------------
   
   [!] only use one option at a time
*/

/* @import "./css/appbutton/appbutton_on_navbar_color_autocolor.css"; /**/
/* @import "./css/appbutton/appbutton_on_navbar_color_autocolor57p.css"; /**/
/* @import "./css/appbutton/appbutton_on_navbar_color_orange.css"; /**/
/* @import "./css/appbutton/appbutton_on_navbar_color_aurora.css"; /**/
/* @import "./css/appbutton/appbutton_on_navbar_color_nightly.css"; /**/
/* @import "./css/appbutton/appbutton_on_navbar_color_deved57p.css"; /**/
/* @import "./css/appbutton/appbutton_on_navbar_color_nightly57p.css"; /**/
/* @import "./css/appbutton/appbutton_on_navbar_color_palemoon.css"; /**/


/* -----------
   Button icon
   -----------
   
   [!] only use one option at a time
*/

/* @import "./css/appbutton/appbutton_on_navbar_icon_white.css"; /**/
/* @import "./css/appbutton/appbutton_on_navbar_icon_dark.css"; /**/
/* @import "./css/appbutton/appbutton_on_navbar_icon_grey.css"; /**/
/* @import "./css/appbutton/appbutton_on_navbar_icon_browser_logo.css"; /**/


/* ------------
   Button label
   ------------
   
   [!] show label and icon
*/

/* @import "./css/appbutton/appbutton_on_navbar_icon_and_label.css"; /**/


/* --------------------------------------------------------------
   Application / hamburger / main menu button in Firefox titlebar
   --------------------------------------------------------------
   
   [!] disable all 'button on navigation toolbar' options for
       'button in Firefox titlebar' options to work properly
*/


/* -----------------------------------------------
   Button in titlebar: label / icon / label + icon
   -----------------------------------------------
   
   [!] only use one option at a time
*/

/* label only */
@import "./css/appbutton/appbutton_in_titlebar.css"; /**/

/* icon only */
/* @import "./css/appbutton/appbutton_in_titlebar_icon_only.css"; /**/

/* label + icon */
/* @import "./css/appbutton/appbutton_in_titlebar_label_and_icon.css"; /**/


/* -----------------------------------
   Button in titlebar: icon appearance
   -----------------------------------
   
   [!] only use one option at a time
   [!] requires 'appbutton_in_titlebar_icon_only.css' to be active
*/

/* @import "./css/appbutton/appbutton_in_titlebar_icon_only_dark.css"; /**/
/* @import "./css/appbutton/appbutton_in_titlebar_icon_only_grey.css"; /**/
/* @import "./css/appbutton/appbutton_in_titlebar_icon_only_browser_logo.css"; /**/
 

/* -------------------------------------------------------------------------
   Button in titlebar: MacOS fix - move 'appbutton in titlebar' to the right
   -------------------------------------------------------------------------
*/

/* @import "./css/appbutton/appbutton_in_titlebar_macOS_fix.css"; /**/


/* -------------------------
   Button in titlebar: color
   -------------------------
   
   [!] only use one option at a time
*/

@import "./css/appbutton/appbutton_in_titlebar_autocolor.css"; /**/
/* @import "./css/appbutton/appbutton_in_titlebar_autocolor57p.css"; /**/
/* @import "./css/appbutton/appbutton_in_titlebar_transparent.css"; /**/
/* @import "./css/appbutton/appbutton_in_titlebar_semi_transparent.css"; /**/
/* @import "./css/appbutton/appbutton_in_titlebar_aurora.css"; /**/
/* @import "./css/appbutton/appbutton_in_titlebar_nightly.css"; /**/
/* @import "./css/appbutton/appbutton_in_titlebar_deved57p.css"; /**/
/* @import "./css/appbutton/appbutton_in_titlebar_nightly57p.css"; /**/
/* @import "./css/appbutton/appbutton_in_titlebar_palemoon.css"; /**/



/* ==============
   TAB appearance
   ==============
   
   [!] only use one option at a time
   [!] custom tab colors are set inside color_variablesXXX.css file(s)
   
*/

/* Classic tabs appearance known from Firefox 4-28 */
@import "./css/tabs/classic_squared_tabs.css"; /**/

/* Classic tabs appearance known from Firefox 4-28 for active tab only  */
/* @import "./css/tabs/classic_squared_tabs_australized.css"; /**/

/* Default tabs with increased contrast for non-active tabs */
/* @import "./css/tabs/default_tabs_enhanced.css"; /**/

/* Tab appearance known from Firefox 57 - 88 */
/* @import "./css/tabs/default_tabs_photon.css"; /**/


/* ======================================================================================
   TABS TOOLBAR POSITION (below titlebar / below navigation toolbar / below main content)
   ======================================================================================
   
   [!] only use one option at a time
   [!] only use BELOW TITLEBAR or BELOW NAVIGATION BAR or BELOW MAIN CONTENT
*/


/* ---------------------------------------------
   TABS BELOW TITLEBAR (Fx56-like tabs position)
   ---------------------------------------------
*/

/* @import "./css/tabs/tabs_below_titlebar_above_navigation_toolbar.css"; /**/


/* --------------------------------------------------------------
   TABS BELOW NAVIGATION AND BOOKMARKS TOOLBARS / TABS NOT ON TOP
   --------------------------------------------------------------

   [!] Note: only 'alt' works with multi-tab lines option.
   [!] Note: might require overriding url bars 'selection color' --> see corresponding area
*/

/* Windows/Linux */
@import "./css/tabs/tabs_below_navigation_toolbar.css"; /**/

/* MacOS */
/* @import "./css/tabs/tabs_below_navigation_toolbar_macOS.css"; /**/


/* Alternative for multi-lined tabs (Glitches might occur with inactive menubar!)
   [!] use option below for multiple tab lines support
*/

/* @import "./css/tabs/tabs_below_navigation_toolbar_alt.css"; /**/

/* [!] no menubar when OS titlebar is active */
/* @import "./css/tabs/tabs_below_navigation_toolbar_alt_force_hidden_menubar.css"; /**/


/* @import "./css/tabs/tabs_below_navigation_toolbar_alt_macOS.css"; /**/

/* Move tabs to a higher position 
   [!] not compatible to 'tabs toolbar - multiple tab lines' option
   [!] only use one option at a time
   [!] EXPERIMENTAL
*/

/* @import "./css/tabs/tabs_below_navigation_toolbar_higher_navbar_positon.css"; /**/
/* @import "./css/tabs/tabs_below_navigation_toolbar_higher_navbar_positon_with_appbutton.css"; /**/
/* @import "./css/tabs/tabs_below_navigation_toolbar_higher_navbar_positon_with_appbutton_icon_only.css"; /**/


/* ----------------------------------------
   TABS BELOW MAIN CONTENT (TABS ON BOTTOM)
   ----------------------------------------
  
   [!] not compatible to 'tabs toolbar - multiple tab lines' option
*/

/* Use this when on Windows/Linux */
/* @import "./css/tabs/tabs_below_main_content.css"; /**/

/* Use this when on MacOS */
/* @import "./css/tabs/tabs_below_main_content_macOS.css"; /**/


/* --------------------------------------------------------------------------------
   TAB BACKGROUND COLORS for default/active/hovered/unloaded tabs and 'new tab' tab
   --------------------------------------------------------------------------------
*/

/* Edit target file to set own custom colors */
/* @import "./config/custom_tab_color_settings.css"; /**/

/* TAB TEXT colors/shadow/weight/style for default/active/hovered/unloaded tabs

   [!] Edit target file to set own custom colors
*/
 
/* @import "./config/custom_tab_text_settings.css"; /**/


/* ------------------------------------------
   MULTIROW / multi lined tabs - EXPERIMENTAL
   ------------------------------------------
   
   [!] only use one option at a time
   [!] BUG: dragging tabs does not work with multi lined tabs
   [!] not compatible with 'tabs toolbar - below main content' option
   [!] only compatible with 'tabs below navigation toolbar alt version'
*/

/* @import "./css/tabs/tabs_multiple_lines.css"; /**/
/* @import "./css/tabs/tabs_multiple_lines_force_newtab_button_visibility.css"; /**/


/* ---------------------------------
   Restore empty/missing tab favicon
   ---------------------------------
   
   [!] only use one option at a time
*/

@import "./css/tabs/missing_tab_favicon_restored_default.css"; /**/
/* @import "./css/tabs/missing_tab_favicon_restored_globe_v2.css"; /**/
/* @import "./css/tabs/missing_tab_favicon_restored_sheet.css"; /**/
/* @import "./css/tabs/missing_tab_favicon_restored_dotted.css"; /**/
/* @import "./css/tabs/missing_tab_favicon_restored_dotted_white.css"; /**/
/* @import "./css/tabs/missing_tab_favicon_restored_brand_logo.css"; /**/


/* ----------------------------
   Custom tab loading animation
   ----------------------------
   
   [!] only use one option at a time
*/

/* @import "./css/tabs/tab_throbber_blue_fx56.css"; /**/
/* @import "./css/tabs/tab_throbber_blue.css"; /**/
/* @import "./css/tabs/tab_throbber_grey_classic.css"; /**/
/* @import "./css/tabs/tab_throbber_green.css"; /**/
/* @import "./css/tabs/tab_throbber_orange_ubuntu.css"; /**/


/* -----------------------
   Tab close icon settings
   -----------------------
   
   [!] only use one option at a time
*/

@import "./css/tabs/tab_close_always_visible.css"; /**/
/* @import "./css/tabs/tab_close_on_active_tab_only.css"; /**/
/* @import "./css/tabs/tab_close_show_on_hover_only.css"; /**/
/* @import "./css/tabs/tab_close_hidden.css"; /**/
/* @import "./css/tabs/tab_close_hidden_for_only_one_visible_tab.css"; /**/
/* @import "./css/tabs/tab_close_at_tabs_start.css"; /**/
/* @import "./css/tabs/tab_close_icon_size.css"; /**/


/* ------------------
   Tab title settings
   ------------------
   
   [!] only use one option at a time
*/

/* @import "./css/tabs/tab_title_left.css"; /**/
/* @import "./css/tabs/tab_title_centered.css"; /**/
/* @import "./css/tabs/tab_title_right.css"; /**/


/* ------------------------------------------------
   DEFAULT TABS - settings for default browser tabs
   ------------------------------------------------
   
   [!] only use one option at a time
   [!] use only, if 'classic squared tabs' are disabled
*/

/* @import "./css/tabs/default_tabs_no_tab_line.css"; /**/
/* @import "./css/tabs/default_tabs_tab_line_red_for_unloaded_tabs.css"; /**/
/* @import "./css/tabs/default_tabs_tab_line_purple_in_private_mode.css"; /**/


/* ------------------
   OTHER TAB SETTINGS
   ------------------
*/

@import "./css/tabs/tab_icon_colors.css"; /**/
/* @import "./css/tabs/default_tabs_reduce_spaces.css"; /**/
/* @import "./css/tabs/tabs_fully_squared.css"; /**/
/* @import "./css/tabs/tab_audio_icon.css"; /**/
/* @import "./css/tabs/tab_audio_icon_colorized.css"; /**/
/* @import "./css/tabs/tabs_container_indicator_for_classic_squared_tabs.css"; /**/
/* @import "./css/tabs/tabs_active_tab_indicator_for_classic_squared_tabs.css"; /**/
/* @import "./css/tabs/newtab_tab_size_equals_tab_size.css"; /**/
/* @import "./css/tabs/newtab_button_always_visible.css"; /**/
/* @import "./css/tabs/tab_icon_inactive_tabs_lower_opacity.css"; /**/
/* @import "./css/tabs/tab_icon_unloaded_tabs_lower_opacity.css"; /**/
/* @import "./css/tabs/tab_maxwidth.css"; /**/
/* @import "./css/tabs/tab_titles_remove_blur.css"; /**/
/* @import "./css/tabs/alltabs_button_always_visible.css"; /**/  /* hidden, if multiple tab rows are used */
/* @import "./css/tabs/pinnedtab_empty_favicon_hidden.css"; /**/

/* [!] edit target file to select which items to hide */
/* @import "./css/tabs/tab_context_menuitems_visibility.css"; /**/

There's a few different kinds of "Tabs on Bottom"
There's...

1. Tabs under Title Bar
2. Tabs under URL bar <------ the one I use.
3. Tabs all the way at the bottom of the browser window.

I don't know which you are referring to.



Also... on the Customize page, I use Compact Density, which requires an about:config setting to even show up or work. Namely: browser.compactmode.show = True






For some of these various settings, I can't really say... this setting by itself, does so and so.
Some I only know because I've added them on top of others.

So for most things I can only help if you start from where I am with my tweaks.
Or to put it another way... do my tweaks then add your own on top of mine.
That's why I try to keep updating the first post, so I have a record of the things I've done.

This topic is like... cloud storage for my Firefox tweaks.


Now @das10 actually understands CSS code better than probably anyone else.

Anak said:

I have.

Here's mine, sorry about it being trimmed:


Thx for the code area, I see you don't run the bkmrks toolbar, removed mine and the spacing was more intrusive into the url bar.

I have a hybrid of #2 - 2.1 Tabs under URL and Bookmarks bars.

What I have.

Looks like I have my work cut out but I have to roll an get things done, not sure when I'll get back.

I can't tell what that stuff is between your URL bar and the Tabs.
I don't have that, so I can't really test to see what affects it.


Also... these are the rest of my Customize settings...








NOTE: I also notified Aris-t2 on Github about this.

General questions and feedback belong here! . Discussion #454 . Aris-t2/CustomCSSforFx . GitHub

@Ghot,
I spent some time comparing the code list, I made some changes but had to go back. Checked, double-checked the about:config settings, nothin' .

Then I remembered those density settings you mentioned on the customize tab. I was on Compact (not supported) and changed them to test.

This 1st pix left, is set to compact (not supported)
2nd right, is set to normal it got a smidge better


3rd left, is set to touch and it's too high but the view icon looks better
4th right, is after I dragged the FF view icon/button back into the customize list
Apologies for the different scale.

So I believe the padding of the view icon was the problem look at how puffed up it is there to the left of the tabs.
I looked for any code or setting but didn't find one but once I placed it back in the customize list the spacing sorted itself out.
This is the new look:


I'm gonna look into changing the padding on those buttons on the url bar, they're too big for my taste. Went back to compact on the density they're still big but they don't look like marshmallows anymore.

@das10
I saw that code else where but wasn't sure how to apply it in the userchrome file so I didn't try it, now I know it's okay to put it at the bottom.
Do you think that's okay or should it be in with it's cousins?

Thx for your help guys!

@Anak

You put @das10's code in: my_userChrome.css file

And in the bottom of userChrome.css file you "tell" it to look in the my_userChrome.css file










Just copy/paste this code into the: my_userChrome.css file

Code:

/* change the TABS TOOLBAR position etc. -using exaggerated -10px value to see effect */
toolbar#TabsToolbar
{margin-bottom: -10px !important;}

You can change the -10px to whatever size you like the best.
Probably -4px or -6px

Anak said:

I left it at -4, it gives the bar a cleaner/more crispy look.

@Ghot

I dont know if you already knew this but I discovered a new "about:config" setting to control the DPI setting of Firefox independent of Windows DPI settings. My Windows setting is 1920 x 1080 @ 150% DPI which makes the Address Bar and Icons Huge so I set Firefox at 125% DPI. to make them look smaller like Classic Firefox. Also you may have to click on both the default and changed images to notice the difference.

Type about:config in the address bar > layout.css.devPixelsPerPx > Edit (pencil) > change value from default - 1.0 to 1.0 for 100% DPI or 1.25 for 125% DPI


Default Setting


Changed setting to 1.25 or 125% DPI which made the icons and webpage text smaller.

Note I also use the addon "ZoomPage WE" so I could get the smaller icons I want with the about:config setting but control the zoom level of the page and text seperately with the addon.

@IownAmoneyPit


There's also a zoom function already available in the Firefox "Customise" window.
If you click on the percent value in the middle, the magnification will return to 100%


By right-clicking almost anywhere at top of browser...









It has a whole bunch of preset zoom sizes.
And if you need values that aren't in there, you can add them in about:config, here...

toolkit.zoomManager.zoomValues .3,.5,.67,.8,.9,1,1.1,1.2,1.33,1.5,1.7,2,2.4,3,4,5

For example, the values above, correspond to these magnifications...
30%, 50%, 67%, 80%, 90%, 100%, 110%, 120%, 133%, 150%, 170%, 200%, 240%, 300%, 400%, 500%

And you can add or remove whatever values you want to/from that list.

You "can't" choose a value... below 30% or above 500%.
But, any value in between can be added or removed.