formatting picture in table so it is centered

I have a table that I am using for configuring the footer of a webpage.  In the first line of the table data I want to center a company logo.   For the second line I want two flags for the two companies we do business in (centered in the row but beside each other.

When I try it out it seems to just float to the left.

Anyone know what I am doing wrong ,  beloe is example of the logo bit.

<table border='1' cellspacing="0">
                                    <tbody>
                                          <tr>
                                                <td style="text-align:center">
                                                      <img src="/images/logo.png" alt="Footer Logo" border="0" height="18" width="75">
                                                </td>
                                          </tr>
                                          
                                    </tbody>
                              </table>
enigma1234567890Asked:
Who is Participating?

Improve company productivity with a Business Account.Sign Up

x
 
Scott Fell, EE MVEConnect With a Mentor Developer & EE ModeratorCommented:
Can you please copy/paste  your html code to http://jsbin.com/aqazut/1/edit.  If you have external css, make sure to copy paste the css into the css area.    

otherwise, just copy paste your entire code here and make sure to include any links to javascript and css.
0
 
TazDevil1674Connect With a Mentor Commented:
Try this instead

<td>
  <p style:text-align:center;><img src="/images/logo.png" alt="Footer Logo" border="0" height="18" width="75">
  </p>
</td>

Open in new window

0
 
Scott Fell, EE MVEConnect With a Mentor Developer & EE ModeratorCommented:
Change your table

<table border='1' cellspacing="0" width="100%">
                                    <tbody>
                                          <tr>
                                                <td style="text-align:center">
                                                      <img src="/images/logo.png" alt="Footer Logo" border="0" height="18" width="75">
                                                </td>
                                          </tr>
                                         
                                    </tbody>
                              </table>
0
Easily Design & Build Your Next Website

Squarespace’s all-in-one platform gives you everything you need to express yourself creatively online, whether it is with a domain, website, or online store. Get started with your free trial today, and when ready, take 10% off your first purchase with offer code 'EXPERTS'.

 
Scott Fell, EE MVEConnect With a Mentor Developer & EE ModeratorCommented:
If this is your only thing in your footer, why are you using a table?

If your footer is set with divs just do this

css:
#footer {text-align:center;}

HTML:

<div id="footer>
        <img src="/images/logo.png" alt="Footer Logo" border="0" height="18" width="75">
</div>
0
 
enigma1234567890Author Commented:
still stuck none of the suggestions for tables worked.

Note its not the only think in table so I dont want to use divs.
0
 
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
The code I gave you works fine.  sample.

 If it is not working in your layout, it is because something else is controlling it.
0
 
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
Try adding   a class to the td <td class="center" style="text-align:center"> and css  td.center{text-align:center;}
0
 
enigma1234567890Author Commented:
I tried padding:auto and that centered the logo but when I add the next row with the two flags its messed up again.

Any other suggestions.
0
 
Scott Fell, EE MVEConnect With a Mentor Developer & EE ModeratorCommented:
It would not be padding auto - if anything it would be margin auto.  However, to center an image you use text-align:center in css.

Here I tried a table in a table like you are probably using and make the footer td of the outer table left align.
 
Using my original code, the image is still centered. Please click this sample to see.  

<table border='1' cellspacing="0" width="100%">
  <tr><td>stuff</td></tr>
  <tr><td align="left">
    <!-- add footer below-->
    <table border='1' cellspacing="0" width="100%">
                                    <tbody>
                                          <tr>
                                                <td class="center" style="text-align:center">
                                                  <img src="" alt="Footer Logo" border="0" height="18" width="75" style="background-color:red">
                                                </td>
                                          </tr>
                                          
                                    </tbody>
                              </table>
    <!-- end footer above-->
   </td></tr>
  
</table>  

Open in new window


If this is not working for you, please post a shortened version of your code with  css.
0
 
COBOLdinosaurCommented:
Just post the link and we can look at the whole picture at once instead of trying to peel an onion.

Cd&
0
 
enigma1234567890Author Commented:
sorry test site not on internet
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.