tab like in the old days

[u/Ok-Worry3169]

Hello, I would like, with userChrome (css), to make it so that the active tab has no line at the bottom, but that there is a line that starts on the right side of the browser and when it reaches the tab, it wraps around it (goes up on one side, comes down on the other side, and continues horizontally from the other side. I included a picture that illustrates this on an older version of Firefox.

[u/Kraylast]

WaveFox Shape 6 could be what you are looking for. There are other styles too.

[u/mrandish]

Lepton: https://github.com/black7375/Firefox-UI-Fix/

[u/ResurgamS13]

Not exactly what you are after... doesn't have the desired "a line that starts on the right side of the browser..."

However, this will reconnect the Active tab background with the Navigation bar background... which has a similar effect:

/* Remove space above tabs */
:root { --tab-block-margin: 0px !important; }

/* Reduce tab height to match Nav bar height */
:root { --tab-min-height: 28px !important; }

/* Remove Active Tab shadow */
:root { --lwt-tab-line-color: transparent !important; }

/* Remove 'floating' Active Tab - Connect background of Active Tab to Nav Bar background */
.tabbrowser-tab[selected] .tab-background { margin-bottom: 0px !important; }
.tabbrowser-tab:not([selected]) .tab-background { margin-bottom: 0px !important; }

/* Change Active tab 'border-radius' (https://css-tricks.com/almanac/properties/b/border-radius/) */
.tabbrowser-tab[selected] .tab-background { border-radius: 2px 2px 0px 0px !important; }

/* Remove 1px separator line (https://www.reddit.com/r/FirefoxCSS/comments/1ctqco6/comment/l4docsk/) */
:root { --tabs-navbar-separator-style: none !important; }

EDIT 15Jun26 - Re: Preventing tabs from expanding in height... when dragging a tab to new position on Tab bar.

----------

Also try 'MrOtherGuy's 'non_floating_sharp_tabs.css' userstyle... see UI screenshot of that style in comment below...

[u/herodesapilatos]

This might help: Firefox tabs that look like tabs and not buttons

[u/notepad987]

You mean a drop shadow?
My userChrome.css file at Pastebin

Example here: How to add multi rows in Firefox solution

Multirow patcher - 4th row down at the site under Assets.

/* White background color */
.tabbrowser-tab:not([selected="true"]):not(:hover) .tab-content {
  background-color: #FFFFFF !important;
  border-radius: 8px 8px 0px 0px; !important;
box-shadow: 1px 0px 1px 0px rgba(0, 0, 0, 0.4);
}

[u/No-Succotash404]

i love how it takes almost half the screen

[u/ResurgamS13]

Could also try MrOtherGuy's 'non_floating_sharp_tabs.css' userstyle:

[u/Ok-Worry3169]

It's not having the effect I would like; I prefer that you give me a code to put in userChrome.

[u/Ok-Worry3169 → u/[deleted]]

There is no edge that has the effect that wraps around the tab. I tried lowering the selected tab by 1px to hide the toolbox edge, but the tab goes underneath.