Topic: How to align table? How to position text inside rows
and columns?
Explanation:
Table Alignment: Tables can be aligned to the left/right/center
using the attribute "align" inside table tag.
Example Code:
<table border=1 bgcolor="green" width=300 height=100 align=center>
<tr height=30>
<td>
HAI
</td>
<td>
Hello
</td>
</tr>
<tr height=70>
<td>
Table Alignment
</td>
<td background="./test.jpg">
This is 2nd row 2nd column <br><br> Nice background
</td>
</tr>
</table>
Result:
Example Code:
<table border=1 bgcolor="green" width=300 height=100 align=center>
<tr height=30>
<td>
HAI
</td>
<td>
Hello
</td>
</tr>
<tr height=70>
<td>
Table Alignment
</td>
<td background="./test.jpg">
This is 2nd row 2nd column <br><br> Nice background
</td>
</tr>
</table>
Result:
HAI
|
Hello
|
Table Alignment
|
This is 2nd row 2nd column
Nice background |
Aligning Content (text) in columns: The content (text,image,etc..) inside the columns can be aligned horizontally using the tag attribute "align".The content (text,image,etc..) inside the columns can be aligned vertically using the tag attribute "valign"
ALIGN can take the values as LEFT/RIGHT/CENTER
VALIGN can take the values as TOP/BOTTOM/CENTER
Example Code:
<table border=1 bgcolor="green" width=80% height=30%ALIGN=center>
<tr height=20%>
<td align=center>
center
</td>
<td align=right>
right
</td>
</tr>
<tr height=70% >
<td valign=top>
top
</td>
<td valign=bottom align=right background="./test.jpg">
Bottom <br><br>
</td>
</tr>
</table>
Result:
center
|
right
|
top
|
bottom right
|