In CSS, the line-height
property controls the leading (led-ing
). Leading refers to the vertical distance from the baseline of one line to the baseline of the next.
Format: .ds-u-leading--[lead|base|heading|reset]
.ds-u-leading--lead
We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.
.ds-u-leading--base
We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.
.ds-u-leading--heading
We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.
.ds-u-leading--reset
We the People of the United States, in Order to form a more perfect Union, establish Justice, insure domestic Tranquility, provide for the common defence, promote the general Welfare, and secure the Blessings of Liberty to ourselves and our Posterity, do ordain and establish this Constitution for the United States of America.
Code snippet
<section class="example-list">
<article>
<code class="ds-u-margin-bottom--1">.ds-u-leading--lead</code>
<div class="ds-u-leading--lead">
We the People of the United States, in Order to form a more perfect Union,
establish Justice, insure domestic Tranquility, provide for the common
defence, promote the general Welfare, and secure the Blessings of Liberty
to ourselves and our Posterity, do ordain and establish this Constitution
for the United States of America.
</div>
</article>
<article>
<code class="ds-u-margin-bottom--1">.ds-u-leading--base</code>
<div class="ds-u-leading--base">
We the People of the United States, in Order to form a more perfect Union,
establish Justice, insure domestic Tranquility, provide for the common
defence, promote the general Welfare, and secure the Blessings of Liberty
to ourselves and our Posterity, do ordain and establish this Constitution
for the United States of America.
</div>
</article>
<article>
<code class="ds-u-margin-bottom--1">.ds-u-leading--heading</code>
<div class="ds-u-leading--heading">
We the People of the United States, in Order to form a more perfect Union,
establish Justice, insure domestic Tranquility, provide for the common
defence, promote the general Welfare, and secure the Blessings of Liberty
to ourselves and our Posterity, do ordain and establish this Constitution
for the United States of America.
</div>
</article>
<article>
<code class="ds-u-margin-bottom--1">.ds-u-leading--reset</code>
<div class="ds-u-leading--reset">
We the People of the United States, in Order to form a more perfect Union,
establish Justice, insure domestic Tranquility, provide for the common
defence, promote the general Welfare, and secure the Blessings of Liberty
to ourselves and our Posterity, do ordain and establish this Constitution
for the United States of America.
</div>
</article>
</section>
Guidance
Accessibility
Many people with cognitive disabilities have trouble tracking lines of text when a block of text is single spaced. Providing spacing between
1.5
to2
allows them to start a new line more easily once they have finished the previous one. — WCAG 2.0 Compliance Techniques