I read that each column of a table can be styled using <colgroup>
and <col>
. I tried the following, but the style speficication is not seeming to work. How can I fix it?
When I do this with width
property, it works. Is there anything wrong with text-align
property?
<html><body><table>
<colgroup>
<col style="text-align:right" />
<col style="text-align:center" />
<col style="text-align:left" />
</colgroup>
<tr>
<td>aaaaaaaaaaa</td>
<td>bbbbbbbbbbb</td>
<td>ccccccccccc</td>
</tr>
<tr>
<td>aaa</td>
<td>bbb</td>
<td>ccc</td>
</tr>
</table></body></html>
The result is that each colum is left aligned by default, ignoring the specification made in colgroup
.
I am using Chrome 17.
While support for colgroup and col seems to be spotty, I don't think one should throw out the baby with the bathwater. I think tables have their place, to display tabular data. Using divs to display tabular data borders on table-phobia in my opinion.
<html><body>
<style>
.left {text-align:left;}
.center {text-align:center;}
.right {text-align:right;}
</style>
<table>
<tr>
<td class="left">aaaaaaaaaaa</td>
<td class="center">bbbbbbbbbbb</td>
<td class="right">ccccccccccc</td>
</tr>
<tr>
<td class="left">aaa</td>
<td class="center">bbb</td>
<td class="right">ccc</td>
</tr>
</table>
</body></html>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With