Versatile Banner reduces #main-outlet width for unclear reasons

Canapin · February 14, 2026, 5:57pm

github.com/discourse/discourse-versatile-banner

common/common.scss

4da4fb7ed


      
          
            .below-site-header-outlet {
              order: -1;
          
              & + .below-site-header-outlet {
                order: -2;
              }
            }
          
            #main-outlet {
              max-width: calc(100% - 16px);
              width: $large-width;
            }
          }
          
          @if $swap_default_positioning == "true" {
            #main > div {
              .below-site-header-outlet {
                order: -2;
          
                & + .below-site-header-outlet {

I’m not sure why this exists. It’s applied all the time, even if the banner is not visible.

The effect is better seen on mobile, but exists on desktop too:

Rule enabled

Rule disabled

Topic		Replies	Views
Be able to put the banner above the main content but not above the sidebar Feature versatile-banner , completed	10	517	September 27, 2023
Order of two items in the same plugin outlet Dev	2	689	September 28, 2022
Make the banner appear above the main content but next to the sidebar Feature category-banners	3	347	July 6, 2023
Missing margin in the .banner- box for Versatile Banner TC UX versatile-banner	0	21	August 28, 2025
A plugin outlet for the footer that keeps the sidebar at full-height UX	2	387	June 26, 2023

Versatile Banner reduces #main-outlet width for unclear reasons

Related topics