Testimonials

data-testimonials since 0.1.0

Quotations in a row of columns. Each one is the page's own <blockquote>, set on a card, with its <footer> on the bottom edge.

Basic

We dropped eleven thousand lines of CSS and the site looked better.
Nadia Rahman, engineer at Ledger

I wrote the whole docs site in HTML. No components, no props, no build.
Tom Aldridge, writer

The first library my designer read without asking me to translate it.
Priya Venkat, founder of Atlas

html

<section data-testimonials>
  <blockquote>We dropped eleven thousand lines of CSS and the site looked better.<footer>Nadia Rahman, engineer at Ledger</footer></blockquote>
  <blockquote>I wrote the whole docs site in HTML. No components, no props, no build.<footer>Tom Aldridge, writer</footer></blockquote>
  <blockquote>The first library my designer read without asking me to translate it.<footer>Priya Venkat, founder of Atlas</footer></blockquote>
</section>

Three columns by default, two with data-testimonials="2".

Notes

The footers sit on the bottom edge, so columns of uneven quotations still start and end together.
The quotation keeps the display face and the left rule it has anywhere else on the page.
Both widths drop to two columns under 900px and to one under 560px.
Name the speaker in the <footer>, not in the quotation: a quotation that introduces itself reads twice.