Vertical Align
Easily change the vertical alignment of inline, inline-block, inline-table, and table cell elements.
Vertical-align on BootstrapExample
Change the alignment of elements with the vertical-alignment utilities. Please note that vertical-align only affects inline, inline-block, inline-table, and table cell elements.
Choose from .align-baseline,
.align-top,
.align-middle,
.align-bottom,
.align-text-bottom,
and .align-text-top as needed.
Multiple links and tap targets are not recommended with stretched links. However, some position
and z-index
styles can help should this be required.
<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>
With table cells:
baseline | top | middle | bottom | text-top | text-bottom |
<div class="table-responsive">
<table class="table table-bordered" 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>
</div>
Have a question? call us now
Need support? Drop us an email
Mon – Sat 07:00 – 21:00
We are open on
brigham and women's hospital
75 francis street, boston ma 02115
General information: 671-732-5500
New Patients: 800-294-9999