The
vertical-align property allows you to set the vertical alignment between several in-line elements that belong to the same parent (eg - same table cell)
The possible values are
| Properties | Description |
|---|
baseline | top | bottom | middle | sub | super | text-top | text-bottom | |
| <length> or <percentage> | |
snippet
<html>
<head>
<style>
span {border:1px solid red;}
</style>
</head>
<body>
<table>
<tr>
<td>
<span style="vertical-align: baseline;">baseline</span>
<span style="vertical-align: top;">top</span>
<span style="vertical-align: bottom;">bottom</span>
<span style="vertical-align: middle;">middle</span>
<span style="vertical-align: sub;">sub</span>
<span style="vertical-align: super;">super</span>
<span style="vertical-align: text-top;">text-top</span>
<span style="vertical-align: 300%;">300%</span>
<span style="vertical-align: -5px;">-50px</span>
</td>
</tr>
</table>
</body>
</html>
