Aligning Text Vertically part 1

• COURSES
• CODE PLAYGROUND
• DISCUSS
• TOP LEARNERS

Aligning Text Vertically

68

1/3

     

The vertical-align Property

The vertical-align property sets an element's vertical alignment. Commonly used values are top, middle, and bottom.

The example below shows how to vertically align the text between the table. 

The HTML:<table border="1" cellpadding="2" cellspacing="0" style="height: 150px;">
<tr>
<td class="top">Top</td>
<td class="middle">Middle</td>
<td class="bottom">Bottom</td>
</tr>
</table>
The CSS:

td.top {
vertical-align: top;
}
td.middle {
vertical-align: middle;
}
td.bottom {
vertical-align: bottom;
}Try It Yourself

Result:
Tap Try It Yourself to play around with the code!