hi, I would like to know how to Apply margin to web content but not when a video is in fullscreen? and keep the margin when Firefox is in fullscreen. I mean I would like to apply a margin to web content that not affect when a video is in fullscreen. I used this code:

:root:not([chromehidden~="toolbar"]) {
        
        /* Web content */
        & #appcontent{
            margin-inline-start: var(--my-vertical-toolbar-width) !important;
        }

        /* Sidebar + sidebar content */
        & #sidebar-box[checked="true"] {
            margin-inline-start: var(--my-vertical-toolbar-width) !important;
        }

        /* Sidebar + sidebar content + web content */
        & #sidebar-box[checked="true"] ~ #appcontent {
            margin-inline-start: 0px !important;
        }
    }

but that applies a margin when a video is in fullscreen, I tried too this code but removes the margin when Firefox is in fullscreen:

:root:not([chromehidden~="toolbar"],[sizemode="fullscreen"]) {
     ...
}
  • MrOtherGuy@lemmy.worldM
    link
    fedilink
    arrow-up
    1
    ·
    5 days ago

    I’m not sure if we’re talking about the same thing, but the first thing I noticed from that video is that it seems as if tabs aren’t closing properly. Same kind of deal happens with horizontal tabs if you unconditionally force min-width or max-width for tabs.

    That being said, I wouldn’t put too much effort into supporting vertical tabs yet because it’s constantly changing still.

    • Godie@lemmy.worldOP
      link
      fedilink
      arrow-up
      1
      ·
      5 days ago

      ooh, I notice a rare behavior when use this in horizontal tabs, so the issue is that min-max width cause problems, I understand.

      /* Horizontal tab size */
      
      .tabbrowser-tab[fadein]:not([style^="max-width"]) {
          max-width: 200px !important;
      }
      

      in Vertical tabs I noticed that the property of the tab that don’t close has fadein property, I tried this code to delete that empty space, but visually works but in the background the tab is still stuck.

      /* Important! bug fix for tabs that keep space after close them */
          
          .tabbrowser-tab {
              &:not([pinned], [fadein]) {
                  visibility: collapse !important;
              }
          }
      
      • MrOtherGuy@lemmy.worldM
        link
        fedilink
        arrow-up
        1
        ·
        5 days ago

        In horizontal tabs the tab is really removed only after its closing animation is done - in that case when its width reaches 0px. I have not looked what the closing transition is in vertical tabs - but it stands to reason that it might be its height. If that is the case (which again is just a guess) then you should make sure that you aren’t setting min-/max-/height for tabs anywhere that then would prevent the tab from being getting to 0px height.