From 4ccd522a764ef54d20651ede5ae84492922bcd98 Mon Sep 17 00:00:00 2001
From: Mark Otto <markd.otto@gmail.com>
Date: Tue, 24 Mar 2020 02:00:45 -0700
Subject: Add `.caption-top` for tables (#30435)

* Move caption-side to <table> element in Reboot

* Add class for .caption-top
---
 site/content/docs/4.3/content/tables.md | 36 +++++++++++++++++++++++++++++++++
 1 file changed, 36 insertions(+)

(limited to 'site/content/docs')

diff --git a/site/content/docs/4.3/content/tables.md b/site/content/docs/4.3/content/tables.md
index d5dc98347..c13a24517 100644
--- a/site/content/docs/4.3/content/tables.md
+++ b/site/content/docs/4.3/content/tables.md
@@ -683,6 +683,42 @@ A `<caption>` functions like a heading for a table. It helps users with screen r
 </table>
 {{< /example >}}
 
+You can also put the `<caption>` on the top of the table with `.caption-top`.
+
+{{< example >}}
+<table class="table caption-top">
+  <caption>List of users</caption>
+  <thead>
+    <tr>
+      <th scope="col">#</th>
+      <th scope="col">First</th>
+      <th scope="col">Last</th>
+      <th scope="col">Handle</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <th scope="row">1</th>
+      <td>Mark</td>
+      <td>Otto</td>
+      <td>@mdo</td>
+    </tr>
+    <tr>
+      <th scope="row">2</th>
+      <td>Jacob</td>
+      <td>Thornton</td>
+      <td>@fat</td>
+    </tr>
+    <tr>
+      <th scope="row">3</th>
+      <td>Larry</td>
+      <td>the Bird</td>
+      <td>@twitter</td>
+    </tr>
+  </tbody>
+</table>
+{{< /example >}}
+
 ## Responsive tables
 
 Responsive tables allow tables to be scrolled horizontally with ease. Make any table responsive across all viewports by wrapping a `.table` with `.table-responsive`. Or, pick a maximum breakpoint with which to have a responsive table up to by using `.table-responsive{-sm|-md|-lg|-xl}`.
-- 
cgit v1.2.3