Hi,
If you are using this kind of code:
<s-page inlineSize="small">
<s-section>
<s-banner>Test</s-banner>
</s-section>
</s-page>
The banner will add extra margin. I think that Polaris should move away from margin and use grid/flexbox. I’ve seen quite a lot of situations already where Polaris adds unwanted space due to its overuse of margin to space elements.
Can you maybe explain why you would want a Banner in a section without any other content in that section? It’s a little unexpected that a section would only have a banner and no other content in it.
Hello,
Of course here this makes little sense, but you could have something like that:
Even if the use case is not that widespread, if you’re using margin for spacing elements you’re going to run into lot of troubles in the long term, so this should probably be rewritten to use gap, or if you absolutely must use margin, you should guard the code with :last-child, :first-child or adjacent selectors.
The guidance for using Banner is
Banners are placed at the top of the page or section they apply to, and below the page or section header.
So this isn’t really a design that aligned with what Polaris should be. That said, I’ll ask our design team their thoughts.
Confirmed with our design team that we should remove this spacing. Thanks for reporting this!
