TABLE Data Display - Text & Cell Direction
The "dir" attribute can be used in the <table>, <tr>, <th> and <td> elements. Using it in the <table> element will cause everything to align to the direction one of two "dir" attribute values so that your information is read from "rtl" (right to left) or from "ltr" (left to right). This an interesting attribute, but I don't use it. I use the "align" attribute in all of my pages.
Example 1 Using "dir='ltr'" in the Table
|
<tr> <td align="center"> <table dir="ltr" width="500" bgcolor="#FFFF00" border="7" style="border-color:#900" cellpadding="5"> <tr class="trtext1"> <th width="60%" bgcolor="#99FF99">File Name</th> <th width="40%">Submitter</th> </tr> <tr bgcolor="#FFFF99"> <td>File for research purposes</td> <td bgcolor="#FF6699">Bryant Walker</td> </tr> </table> </td> </tr> |
||||
|
The example shows everything in the table, i.e., cells and data, aligned to the left so that it is read from left to right. Notice that the <th> element overrides the "dir" attribute and positions the text in the center of the cell.
Example 2 Using "dir='rtl'" in the Table
|
<tr> <td width="300" align="center"> <table width="500" dir="rtl" border="7" style="border-color:#900" cellpadding="5"> <tr style="background-color:#900; color:#FFF; font-size:16px; font-weight:bold"> <td width="60%">File Name</td> <td width="40%">Submitter</td> </tr> <tr bgcolor="#FFFF99"> <td>File for research purposes</td> <td>Bryant Walker</td> </tr> </table> </td> </tr> |
||||
|
The table in the second example has flipped to the right. The information and cells have been switched so that the data would be read from right to left using the "rtl" attribute value. All of the text has been shifted to the right without the override of the <th> element and the wider cells are now on the right. Cute, but needed only on a rare occasion.
