Section break
You can use the govuk-section-break
classes on an <hr>
element to create a thematic break between sections of content. govuk-section-break
has class-based modifiers for different size margins.
By default govuk-section-break
is only visible by its margin. You can add the govuk-section-break--visible
class to make it visible with a separator line.
<hr class="govuk-section-break govuk-section-break--xl govuk-section-break--visible">
<hr class="govuk-section-break govuk-section-break--l govuk-section-break--visible">
<hr class="govuk-section-break govuk-section-break--m govuk-section-break--visible">
<hr class="govuk-section-break govuk-section-break--visible">
Help improve this style
If you spot a problem with this guidance you can propose a change.
If you’re not sure how to do this, read guidance on how to propose changes in GitHub.
Need help?
If you’ve got a question about the GOV.UK Design System, contact the team.