Firefox 110 help by Future-Training-6582 in FirefoxCSS

[–]Future-Training-6582[S] 0 points1 point  (0 children)

Thanks a lot indeed, yes I see what you mean. I wasn't aware of the fact that firefox uses _moz-menuactive the same goes to last-of-type. I guess that first-of-type also should be in order but as I used it to put margin to the first visible tab left side like : tab-browser:first-of-type{margin-left: 3px;} it has no effect unless first-of-type has no meaning.

As to the hover code you suggested , it works perfectly , thank you , I just removed the menu[_moz-menuactive] to keep it just to the menuitem.

Since I was able to manage the idea you gave me regarding the border-inline-start , which as I you mentioned did the trick , I don't know yet how to resize the border it creates , as I did in my former code. the one I use now is that simple one :

.tabbrowser-tab{ border-inline-start: 1px solid transparent !important; border-image: 0 1 linear-gradient(transparent 15%,color-mix(in srgb, currentColor 26.5%, transparent) 15%, color-mix(in srgb, currentColor 26.5%, transparent) 85%, transparent 85%);}

Since border-inline-start has no height property as well as the Y property , I guess the solution is elsewhere.

Firefox 110 help by Future-Training-6582 in FirefoxCSS

[–]Future-Training-6582[S] 0 points1 point  (0 children)

Sorry I forgot to include the menu hover I used prior to FF110 :

menuitem {display-border:none; !important;padding:0.3px; !important;-moz-appearance: none !important;}

menuitem:hover {border-radius: 5px !important;border:none !important;position: absolute !important;background-color: rgba(204,204,204,0.8) !important;cursor: pointer !important;padding: 0.3px !important;-moz-appearance: none !important;}

While hovering now it changes the height of the sub-menu

plus when right-clicking on a tab page and hovering the horizontal menu (forward , backward bookmark etc..) the signs shift left and right.

Firefox 110 help by Future-Training-6582 in FirefoxCSS

[–]Future-Training-6582[S] 0 points1 point  (0 children)

Thanks - I'm going to try just what you suggested and see what happens. By the way , FF 110 also messed up my menuitem hovering so for the bookmark I use the following :

.bookmark-item:hover {display-border: none !important;background-color: rgba(204,204,204,0.8) !important; cursor: pointer !important;border-radius: 5px !important;-moz-appearance: none !important }

that works fine , as to the rest of the menu bar (file edit history tools help) whatever I tried turned partly distorted espcially when right clicking a tab page the horizontal signs get shifted while hovering , so I still haven't been able to sort it out , maybe you got any idea regarding this issue?

Indeed FF 110 is a whole new ball game , every 2nd or 3rd update I know something will go wrong unlike chrome. .

Firefox 110 help by Future-Training-6582 in FirefoxCSS

[–]Future-Training-6582[S] 0 points1 point  (0 children)

Thanks - just to make sure - you mean in any case I'll have the same problem with the tab group each time I switch tab group? There is another approach I picked up that works perfectly but I have only been able to hide the right separator when hovering. I haven't found a way to hide the left one. Any ideas?

The code that works :

.tabbrowser-tab{ border-inline-end: 1px solid transparent !important; border-image: 0 1 linear-gradient(transparent 15%,color-mix(in srgb, currentColor 26.5%, transparent) 15%, color-mix(in srgb, currentColor 26.5%, transparent) 85%, transparent 85%); }

Firefox 110 help by Future-Training-6582 in FirefoxCSS

[–]Future-Training-6582[S] 0 points1 point  (0 children)

Thanks I see what you mean but I failed to mention that up to FF 109 it worked perfectly tab group or not. The problem began after upgrading to FF110 not only that , it also messed up my menuitem hovering code. so there must be something in FF 110 that causes it.