Penggunaan Vertical Alignment dalam Bootstrap

Hello guys! Bootstrap merupakan salah satu Framework CSS yang paling terkenal dan sering digunakan. Kali ini kita akan membahas tentang Penggunaan Vertical Alignment dalam Bootstrap.

Sumber : Getbootstrap.com


Ubah perataan elemen dengan utilitas penyelarasan vertikal. Harap dicatat bahwa penyelarasan vertikal hanya memengaruhi elemen inline, inline-block, inline-table, dan sel tabel.

Pilih dari .align-baseline.align-top.align-middle.align-bottom.align-text-bottom, dan .align-text-top sesuai kebutuhan.

Untuk memusatkan konten non-inline secara vertikal (seperti <div> dan lainnya), gunakan utilitas kotak fleksibel kami.

Dengan Elemen Inline :

<span class="align-baseline">baseline</span>
<span class="align-top">top</span>
<span class="align-middle">middle</span>
<span class="align-bottom">bottom</span>
<span class="align-text-top">text-top</span>
<span class="align-text-bottom">text-bottom</span>

Dengan Sel Tabel :

<table style="height: 100px;">
  <tbody>
    <tr>
      <td class="align-baseline">baseline</td>
      <td class="align-top">top</td>
      <td class="align-middle">middle</td>
      <td class="align-bottom">bottom</td>
      <td class="align-text-top">text-top</td>
      <td class="align-text-bottom">text-bottom</td>
    </tr>
  </tbody>
</table>


Mohon maaf apabila ada kesalahan sedikit pun pada Kode Program ini.

Terima Kasih 😀😊😘👌👍 :)

Post a Comment

Previous Post Next Post