Skip to main content Skip ad navigationem soUicitudo
Check
in English

Gratia diei et noctis verticalis

Lineae verticalis, inlinei, inlinei, inlinei, et tabulae cellae elementa facile mutant.

Gratia diei et noctis elementorum vertical-alignmentutilitas. Quaeso nota quod verticalis-align tantum afficit lineas, inlineum, inlineum, ac mensam cellam elementorum.

Elige ex .align-baseline, .align-top, .align-middle, .align-bottomet .align-text-bottomprout .align-text-topopus fuerit.

Ad verticaliter centrum contentum non-inlineum (sicut <div>s et plus), utere nostra flexo capsula utilitates .

Cum inline elementis:

baseline top middle bottom text-top text-bottom
html
<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>

Cum cellulis mensae:

baseline top medium imo text-top text-bottom
html
<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>

Sass

Utilitas API

Vertical align utilitas declarantur in nostris utilitatibus API in scss/_utilities.scss. Utilitatibus uti disce API.

    "align": (
      property: vertical-align,
      class: align,
      values: baseline top middle bottom text-bottom text-top
    ),