Bootstrap 5 Learning Kit

XSXSSMSMMDMDLGLGXLXLXXLXXL
Extra small: <576pxSmall: ≥576pxMedium: ≥768pxLarge: ≥992pxExtra large: ≥1200pxExtra extra large: ≥1400px
Page Navigation:
Inline and inline-blockTable cell

Vertical align

Inline and inline-block

Baseline

Text-top

Text-bottom

Top

Middle

Bottom

<h1>Baseline<img src="../img/20x20.png"></h1>
<h1>Text-top<img src="../img/20x20.png"></h1>
<h1>Text-bottom<img src="../img/20x20.png"></h1>
<h1>Top<img src="../img/20x20.png"></h1>
<h1>Middle<img src="../img/20x20.png"></h1>
<h1>Bottom<img src="../img/20x20.png"></h1>
<h1>Baseline<img src="../img/20x20.png"></h1> <h1>Text-top<img src="../img/20x20.png"></h1> <h1>Text-bottom<img src="../img/20x20.png"></h1> <h1>Top<img src="../img/20x20.png"></h1> <h1>Middle<img src="../img/20x20.png"></h1> <h1>Bottom<img src="../img/20x20.png"></h1>

Table cell

Text-top and text-bottom not applicable on table cells

Baseline Top Middle Bottom 
<p>Text-top and text-bottom not applicable on table cells</p>
<table class="table" style="height: 200px;">
  <tbody>
    <tr>
      <td>Baseline</td>
      <td>Top</td>
      <td>Middle</td>
      <td>Bottom</td>
    </tr>
  </tbody>
</table>
<p>Text-top and text-bottom not applicable on table cells</p> <table class="table" style="height: 200px;"> <tbody> <tr> <td>Baseline</td> <td>Top</td> <td>Middle</td> <td>Bottom</td> </tr> </tbody> </table>