You could try the Add-on Australis small icons.

Sorry but that add-on is not avilable on linux

See if this is close to what you want. https://userstyles.org/styles/89038/firefox-australis-custom-tabs-for-2-5

Yes it is something like that but my biggest problem is that I do not like the very tall tab buttons Plus that addon made everything so small that it was unusable

by the way, Thank you for the reply

I use this code for the Tab bar in the userChrome.css file with the tab on bottom and close buttons hidden (I middle-click the tab). I have a lot of tabs open and it is always possible to accidentally close a tab when clicking a tab to set focus.

Add code to the userChrome.css file below the default @namespace line.

• http://kb.mozillazine.org/userChrome.css

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */

#TabsToolbar {-moz-box-ordinal-group:10000!important; height:25px!important; margin-top:-1px!important; margin-bottom:1px!important}

/* Tab bar: adjust height - chrome://browser/skin/browser.css */
#tabbrowser-tabs {height:25px!important; min-height:25px!important; border-left: 1px threedshadow solid}

.tab-background-start[selected=true]::after,
.tab-background-start[selected=true]::before,
.tab-background-start,
.tab-background-end,
.tab-background-end[selected=true]::after,
.tab-background-end[selected=true]::before {
  min-height:25px!important;
}
#tabbrowser-tabs .toolbarbutton-icon        {padding-bottom:3px!important}
#tabbrowser-tabs .tabbrowser-tab .tab-label {padding-bottom:1px!important}
#tabbrowser-tabs .tabbrowser-tab .tab-close-button {display:none!important}

The customization files userChrome.css (user interface) and userContent.css (websites) are located in the chrome folder in the Firefox profile folder.

• http://kb.mozillazine.org/Editing_configuration

I believe this is because I very purely explained the my question sorry I am not sure how will that help me in my case I will add an image to show what I want to do with firefox

I tested a simplified version of cor-el's rule and wanted to show the result on the tab bar. I think the Navigation toolbar is a little trickier to shrink because the back button is very tall.

Edit: here is that rule for copy/paste purposes

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
#tabbrowser-tabs, 
.tab-background-start[selected=true]::after,
.tab-background-start[selected=true]::before,
.tab-background-start,
.tab-background-end,
.tab-background-end[selected=true]::after,
.tab-background-end[selected=true]::before {
  min-height: 24px;
}

I have a question where should I enter that code? should I get an addon or edit a file ??

Thank you very much for the reply

As cor-el posted - http://kb.mozillazine.org/UserChrome.css

Or you can use ChromEdit Plus which provide a user interface inside Firefox for editing the 3 "user" files. http://webdesigns.ms11.net/chromeditp.html

I am sorry I edited the userChrome.css file but no changes have taken place is there a way to select that profile ?

http://i.imgur.com/YNFXHHL.png

here is how it looks now

this is what I used

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
#tabbrowser-tabs, 
.tab-background-start[selected=true]::after,
.tab-background-start[selected=true]::before,
.tab-background-start,
.tab-background-end,
.tab-background-end[selected=true]::after,
.tab-background-end[selected=true]::before {
  min-height: 24px;
}

The userChrome.css file belongs in the Profile folder, in the /chrome/ folder. The userChrome.css file won't be used if its located anywhere else.

Use Help > Troubleshooting Information - then hit the Show Folder button to open your Profile folder. Then close Firefox before doing any editing.

Or use the ChromEdit Plus extension.

Again huge thank you for the reply but sadly it does not work, can it be because I am running Windows 8 right now or that I am using not default theme (back in the day it was called persons or something)

I'm only able to test on Windows 7, with an Aero theme, so I don't know whether Firefox is using a different style sheet for Windows 8.

It is my understanding that userContent.css is only read at startup, so you have to exit/restart Firefox to see any changes. To experiment interactively, you can use the Stylish extension with its handy Preview button.

https://addons.mozilla.org/firefox/addon/stylish/

I don't know whether a persona (lightweight theme) touches these rules and could override your own user-specified style. Adding !important might help with that:

  min-height: 24px !important;

You can reduce the height of the Back button by modifying the padding values of the image.

#nav-bar {padding-top:0px!important; padding-bottom:1px!important; height:31px!important}

#urlbar-container #back-button {margin-top:1px!important; margin-bottom:0px!important}
#urlbar-container #back-button image {padding:3px 3px !important}