<TelerikWizard Width="600px" Height="300px"
               @bind-Value="@WizardStep"
               Class="scrollable-stepper">
    <WizardSettings>
        <WizardStepperSettings />
    </WizardSettings>
    <WizardSteps>
        @for (int i = 1; i <= 20; i++)
        {
            <WizardStep Text="@($"{i}")" Label="@( $"Label {i}" )" @key="@( $"key{i}" )">
                <Content>
                    <p>Step content</p>
                </Content>
            </WizardStep>
        }
    </WizardSteps>
</TelerikWizard>

<style>
    .scrollable-stepper {
        border: 1px solid red;
    }

    .scrollable-stepper .k-stepper {
        overflow-y: hidden;
        overflow-x: auto;
        padding-bottom: 1em;
    }

    .scrollable-stepper .k-stepper .k-step-list-horizontal {
        width: 1600px;
    }

        .scrollable-stepper .k-stepper .k-progressbar {
            width: 1520px; /*(step list width - 1 step width)*/
        }

</style>

@code {
    int WizardStep = 0;
}