उबें संरेखण

इनलायन, इनलायन-ब्लॉक, इनलायन-टेबल, आनी कोश्टक कक्ष घटकांची उबी संरेखण सहज बदलात.

vertical-alignmentउपयुक्तताय कडेन घटकांची संरेखण बदलात . उपकार करून लक्षांत दवरात की उबें-संरेखित फकत इनलायन, इनलायन-ब्लॉक, इनलायन-कोश्टक, आनी कोश्टक कक्ष घटकांचेर परिणाम करता.

.align-baseline, .align-top, .align-middle, .align-bottom, .align-text-bottom, आनी गरज पडल्यार निवडात .align-text-top.

बिगर-इनलायन सामुग्री ( <div>s आनी चड सारकीं) उब्या केंद्रीत करपाक, आमचीं फ्लेक्स बॉक्स उपयुक्तताय वापरात .

इनलायन घटकांवांगडा: १.

बेसलाइन वयर मदीं सकयल मजकूर-वयर मजकूर-सकयल

<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>

कोश्टक कोशिकांवांगडा: १.

मुळावी रेखा

वयर

मदलें

तळ

मजकूर-टॉप

मजकूर-तळें

<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>

सास

उपयुक्तताय एपीआय

उबी संरेखण उपयुक्तताय आमच्या उपयुक्तताय API मदीं 2019 वर्सा जाहीर केल्या scss/_utilities.scss. उपयुक्तताय एपीआय कसो वापरचो तें शिकात.

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