Theoretically it should be possible to make child elements flow vertically instead of horizontally, by setting these properties on the parent: display: flex; flex-direction: column;. I tried that with a bunch of the tab elements and it didn’t work. The problem with addons like TST is that they glitch out sometimes, and you have to wait for the tabs to load, it takes much longer on my M1 Mac once I have 100s of tabs open (don’t judge me).

  • @TheTwelveYearOldOP
    link
    English
    08 months ago

    Oh shit, where did u find that photo? Could I see the CSS so I could try to figure it out?

    • @MrOtherGuy
      link
      English
      28 months ago

      Sure, I’ll link it to you later when I get home. It’s really just a handful of lines of CSS.

      But I suppose the main issue why you haven’t got flex-direction to work is because the scrollbox has orient="horizontal" attribute and elements matching that are styled to have flex-direction horizontal in agent stylesheet with important tag. You cannot override that with userChrome. Practically this means that you cannot use standard flexbox display model for that scrollbox. Instead, I used display: -webkit-box with its equivalent properties to make it vertical

    • @MrOtherGuy
      link
      English
      28 months ago

      So, like here is a bit more useful version. It’s no more “just a handful of lines” because I needed to add a few workarounds for some obvious issues. And it surely is still not great - probably the most annoying issue is that if it ever happens that Firefox thinks that the tabs would overflow then you will irrecoverably lose the ability to scroll the those vertical tabs using mouse wheel - until you restart Firefox. And also as I already mentioned you can’t reorder tabs. And probably a whole bunch of other issues as well.