Wordpress Themes - WP Forum at BFA - [SOLVED] How to center text in the table?

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)

- Center area post/pages (http://forum.bytesforall.com/forumdisplay.php?f=32)

- - [SOLVED] How to center text in the table? (http://forum.bytesforall.com/showthread.php?t=12583)

[SOLVED] How to center text in the table?

I've created a new page. I click on the HTML tab and enter the table info I need. See example below

Both the header and the cell content should be centered, but I'm finding:
- When I look at the table in the "visual" tab in the admin tool, the text is centered
- When I look at the page in either FF or IE, *neither* the header or the cell is centered

Suggestions on how to fix?

George

<table border="1">
<tbody>
<tr>
<th></th>
<th align="center">Photos Per Page</th>
<th align="center">Price Per Page</th>
<th align="center">Comments</th>
</tr>
<tr>
<td rowspan="3"><img style="float: left; padding: 0 0ex 0ex 0;" src="http://localhost/Photo_album.gif" alt="" width="100" height="90" /></td>
<td width="90" align="center"><span style="font-size: small;">2</span></td>
<td width="90" align="center"><span style="font-size: small;">30¢</span></td>
<td rowspan="3" align="center"><span style="font-size: small;"> </span>
<ul>
<li><span style="font-size: small;">To prevent damage, Aberscan will not remove photos from an album. We will scan the entire page, then manually crop out the photos</span></li>
</ul>
</td>
</tr>
<tr>
<td align="center"><span style="font-size: small;">3</span></td>
<td align="center"><span style="font-size: small;">45¢</span></td>
</tr>
<tr>
<td align="center"><span style="font-size: small;">4 or more</span></td>
<td align="center"><span style="font-size: small;">60¢</span></td>
</tr>
</tbody>
</table>

I have one more observation. When I change the alignment in ATO->Style Tables for table headers and table cells to "center", then all my cells are centered. It is as if the ATO -> Style settings are being set after the <td align="xxx"> setting, thus overwriting the align control I'd like for each cell. I don't want every cell to be aligned center or aligned left.

thoughts?

Because of the nature of the cascading in CSS, you are picling up 'text-align's from parent elements. What you should do is code your own CSS for your tables with your own classed. For example where you have

HTML Code:

<table border="1">

<tbody>

<tr>

<th></th>

<th align="center">Photos Per Page</th>

<th align="center">Price Per Page</th>

<th align="center">Comments</th>

use

HTML Code:

<table border="1" id="my-post-table">

<tbody>

<tr>

<th></th>

<th class="my-table-center">Photos Per Page</th>

<th class="my-table-center">Price Per Page</th>

<th class="my-table-center">Comments</th>

and then you could just add a css insert

HTML Code:

#my-post-table .my-table-center{ text-align: center;}

any element you wanted left aligned, you could add a class of my-table-left' and

HTML Code:

#my-post-table .my-table-left{ text-align: left;}

Thanks!!

I also found I can just remove the alignment keywords the ATO->Style Table page and let the html code do the alignment in the cells needed.