HTML Form Code For Beginners (And When To Use It)

Attribute of

Code Example For Tr In HTML (To Organize Table Rows)

What does HTML Form Code For Beginners (And When To Use It) do?

Sets the vertical alignment of all content in a table row.

Code Example

<table>
  <tr valign="top" style="height: 80px;">
    <td>First column</td>
    <td>Second column</td>
    <td>Third column</td>
  </tr>
  <tr valign="middle" style="height: 80px;">
    <td>First column</td>
    <td>Second column</td>
    <td>Third column</td>
  </tr>
  <tr valign="bottom" style="height: 80px;">
    <td>First column</td>
    <td>Second column</td>
    <td>Third column</td>
  </tr>
</table>

Vertical Allignment of Table Data

The valign attribute could be applied to a <tr> element to control the vertical alignment of the contents of every child <td> element. Four attributes could be used with the valign attribute: top, bottom, middle, and baseline. However, support for the baseline value is inconsistent for this deprecated attributed. You can accomplish the same thing by using the vertical-align CSS property. For example, we can duplicate the table in the example above using CSS to replace the valign attribute like this:

<style> .first-row {   vertical-align: top; } .second-row {   vertical-align: middle; } .third-row {   vertical-align: bottom; } .example-table tr {   height: 80px; } </style> <table class="example-table">   <tr class="first-row">     <td>First column</td>     <td>Second column</td>     <td>Third column</td>   </tr>   <tr class="second-row">     <td>First column</td>     <td>Second column</td>     <td>Third column</td>   </tr>   <tr class="third-row">     <td>First column</td>     <td>Second column</td>     <td>Third column</td>   </tr> </table> 

You should also note that this property will only have an effect if the row is tall enough for the text to have somewhere to go. If the height of the row is autofit to the contents of each data cell, align the contents vertically will have no effect.

Adam Wood

Adam is a technical writer who specializes in developer documentation and tutorials.