image align in table problem

[mlegg]

on this page http://www.pscompetitiveedge.com/team-challenge2.html
under the film strip slideshow I was trying to center the table, the image in the right <td> is messed up. I want to get the Click here to watch the video centered (left to right) on the background image.



HTML is attached because it says the code is TOO long

the CSS is located at http://www.pscompetitiveedge.com/styles.css

[auntnini]

I'm guessing (because I couldn't test it) that adding text-align: center; for class="c5" <span> and class="c6" <TD> style rules might fix this. The clickflame image in <TD c6> is an inline element that would be treated like a text character, and the background image is centered. You probably could combine and eliminate some of the multitude of overly specific style rules.

 
<style type="text/css">
  div.c9 {clear:both}  
  p.c8 {text-align:center}  
  em.c7 {text-decoration: underline}  
  td.c6 {background-image: url(images/rec3.jpg); background-repeat: no-repeat; background-position: center center}  
  span.c5 {color: #FF0000; font-size:150%;}  
  p.c4 {text-align:center;}  
  div.c3 {text-align: center;}  
  h2.c2 {text-align:center;}  
  div.c1 {text-align:center;} 
</style>

<td style="width:33%" class="c6">
  <a href="javascript:popUp('media/convention/empower.html')">
  <img src="images/clickflame.gif" border="0" height="45" width="170" alt="click flame"></a> 
  <br>
  <strong><em><span class="c5">To watch the video</span></em></strong>
</td>

[mlegg]

I used that code above, but still get this

[auntnini]

The code shown above is your original code. I should have been more descriptive.

    td.c6 {background-image: url(images/rec3.jpg); background-repeat: no-repeat; background-position: center center;
           text-align:center; }  
    span.c5 {color: #FF0000; font-size:150%; 
            text-align:center; }

But, again, I did not text it.

[mlegg]

I get this now



now the <li> are all centered too.

[coothead]

Hi there mlegg,

change this...

<td style="width:33%" class="c6">

...to this...

<td style="width:33%;text-align:center" class="c6">

coothead

[mlegg]

YAY! It works and looks correct now. I don't know why my brain was half off for this page.

http://www.pscompetitiveedge.com/teamchallenge.html is the complete page. How do you think it is? Any suggestions?