← All layouts  ·  Publishing

Long-form article

Standfirst, body measure, pull quotes and related reading.

The body is set to a reading measure and the furniture hangs off it. Related reading sits at the end, where somebody who finished is deciding what to do next.

  • .ms-card
  • .ms-btn
  • .ms-stat
  • .ms-divider
  • .ms-prose
  • .ms-topbar

Open full page

Live

The layout as it renders, in a frame at its own width. Resize the window to watch it respond — the frame is a real viewport.

How to build it

This is the layout's template, read from disk — the same file the frame above renders, so it cannot drift out of date. Copy it into your own page and replace the content; every class in it ships in mcgowan.css.

<header class="ms-topbar">
    <div class="ms-logo"><a class="u-link" href="#">The Meridian</a></div>
    <nav class="ms-topbar__nav">
        <a href="#">News</a><a href="#">Business</a><a href="#">Culture</a><a href="#">Opinion</a>
    </nav>
    <a class="ms-btn ms-btn--primary ms-btn--sm" href="#">Subscribe</a>
</header>

<div class="u-container u-py-8" style="max-width:1100px">
    <div class="u-grid u-grid-cols-12">
        <article class="u-col-12 u-col-lg-8">
            <span class="ms-badge">Business</span>
            <h1 style="font-size:clamp(1.9rem,3.6vw,2.8rem); line-height:1.12">
                The decade-long argument over who owns delay data</h1>
            <p style="font-size:1.15rem; color:#6b7280">Fourteen operators have four months
                to publish journey-level figures. The fight to get here says as much about
                regulation as about trains.</p>
            <p class="ms-stat__meta">By Ellie Roberts &middot; 22 August 2026 &middot; 8 min read</p>
            <span class="ms-thumb"></span>
            <p class="ms-stat__meta">Passengers at Oxenholme, where punctuality has been
                disputed since 2016.</p>

            <div class="ms-prose ms-prose--measure u-mt-6">
                <p>For ten years the industry published one number a quarter, and for ten
                    years nobody outside it could say what the number meant. That ends in
                    December.</p>
                <blockquote>If you only publish the average, you have not published
                    anything anybody can act on.</blockquote>
                <p>The regulator's position, set out in a forty-page determination, is that
                    aggregation had become a way of avoiding scrutiny rather than a way of
                    simplifying it.</p>
                <h2>What changes in December</h2>
                <p>Operators must publish arrival times for every scheduled service, in a
                    machine-readable format, within seven days.</p>
                <p>Two of the fourteen have said they will comply early.</p>
            </div>

            <div class="ms-card ms-card--flat u-mt-6">
                <div class="ms-toolbar">
                    <span class="ms-avatar-md">ER</span>
                    <div><strong>Ellie Roberts</strong>
                        <p class="ms-stat__meta">Transport correspondent</p></div>
                </div>
            </div>
        </article>

        <aside class="u-col-12 u-col-lg-4">
            <div class="ms-card ms-card--flat" style="position:sticky; top:1rem">
                <h2>Related</h2>
                <p><a class="u-link" href="#">Freight volumes steady as fuel eases</a></p>
                <hr class="ms-divider">
                <p><a class="u-link" href="#">The case for publishing the raw numbers</a></p>
                <hr class="ms-divider">
                <p><a class="u-link" href="#">Regulator's determination, in full</a></p>
            </div>
        </aside>
    </div>
</div>