How can I eliminate excessive white space in my Narrative Theme?

Topic summary

Main issue: reduce the large white space above the Featured Collection title in Shopify’s Narrative theme and optionally make the layout full‑width (no side margins).

Key guidance provided:

  • Edit Sections > featured-collection.liquid and add inline CSS to the title tag:

    to tighten spacing. Rationale: changing theme.scss.liquid would affect all h2 sitewide.

  • To widen the site, add to Assets > theme.scss.liquid: .wrapper, .main-content, .shopify-section { max-width: none !important; }. Strongly duplicate the theme first; stylesheet versions can’t be rolled back.

Additional cases across other themes:

  • Block Shop: remove space in a mid‑page section via targeted CSS (e.g., zero padding for a specific section/Instagram block), and adjust the first homepage section margin: .index-sections .shopify-section:first-child:not(.shopify-section–full-width) { margin-top: 0; } or set to 10px.
  • Other users asked to remove spacing on blogs and mobile; store‑specific fixes and URLs requested. One user reported a suggested snippet broke the layout and reverted to a duplicate.

Status: Partial resolutions provided (Narrative heading spacing and a generic full‑width approach). Several follow‑ups remain open pending store URLs or theme‑specific adjustments. Screenshots illustrate the spacing areas.

Summarized with AI on December 25. AI used: gpt-5.

@Marc_Nixon ,

Add below css

section.main-content {
    background-color: rgb(212, 170, 160);
}