A table is used to display structured data in rows and columns, commonly for reports, dashboards, pricing tables, and lists.
|
Month Date Year Lorem Ipsum is simply dummy text Month Date Year XX:XX Lorem Ipsum |
|
Month Date Year Lorem Ipsum is simply dummy text Month Date Year XX:XX Lorem Ipsum |
|
Month Date Year Lorem Ipsum is simply dummy text Month Date Year XX:XX Lorem Ipsum |
<div class='bp-tb version-first'>
<table>
<tbody>
<tr>
<td class='bp-tb--row'>
<div class='bp-tb--row-col-1 bp-tb__d-block bp-tb__m-none'>
<p class='bp-tb__sub-title overline--two'>
Month <span class='large-text-3'>Date</span> Year
</p>
</div>
<div class='bp-tb--row-col-2'>
<p class='bp-tb__title para--two'>
Lorem Ipsum is simply dummy text
</p>
<p class='para--three'>
<span class='bp-tb__d-none bp-tb__m-block'>Month Date Year</span>
XX:XX Lorem Ipsum
</p>
</div>
<div class='bp-tb--row-col-3'>
<button
type='button'
class='btn btn--small btn--white'
aria-label='Small Button'
>
Button
</button>
</div>
</td>
</tr>
<tr>
<td class='bp-tb--row'>
<div class='bp-tb--row-col-1 bp-tb__d-block bp-tb__m-none'>
<p class='bp-tb__sub-title overline--two'>
Month <span class='large-text-3'>Date</span> Year
</p>
</div>
<div class='bp-tb--row-col-2'>
<p class='bp-tb__title para--two'>
Lorem Ipsum is simply dummy text
</p>
<p class='para--three'>
<span class='bp-tb__d-none bp-tb__m-block'>Month Date Year</span>
XX:XX Lorem Ipsum
</p>
</div>
<div class='bp-tb--row-col-3'>
<button
type='button'
class='btn btn--small btn--white'
aria-label='Small Button'
>
Button
</button>
</div>
</td>
</tr>
<tr>
<td class='bp-tb--row'>
<div class='bp-tb--row-col-1 bp-tb__d-block bp-tb__m-none'>
<p class='bp-tb__sub-title overline--two'>
Month <span class='large-text-3'>Date</span> Year
</p>
</div>
<div class='bp-tb--row-col-2'>
<p class='bp-tb__title para--two'>
Lorem Ipsum is simply dummy text
</p>
<p class='para--three'>
<span class='bp-tb__d-none bp-tb__m-block'>Month Date Year</span>
XX:XX Lorem Ipsum
</p>
</div>
<div class='bp-tb--row-col-3'>
<button
type='button'
class='btn btn--small btn--white'
aria-label='Small Button'
>
Button
</button>
</div>
</td>
</tr>
</tbody>
</table>
</div>