table cell align

• 

  midwaysurf · Member · Aug 6, 2011 at 5:59 am

  • Copy link
  • Add topic to favorites

  In TMA theme a simple html table has different vertical alignment in its two side by side cells – one aligns top, the other bottom (one text and the other an image).

  And align tags don’t work? .

  Hoping these two cells of a table in a Page can both align top? http://midwaysurf.com/site-map/ on the left, scrolling down.

  The blog I need help with is: (visible only to logged in users)

• 

  1tess · Moderator Emeritus · Aug 6, 2011 at 6:24 am

  • Copy link

  Your image:
  http://midwaysurf.files.wordpress.com/2011/08/strip0012.jpg
  returns a 404 not found

  the align-top, align-middle, and align-bottom tags are no longer used. code should be like this for your table:

  <table border="0" cellspacing="0" cellpadding="0" align="center">
  <tbody>
  <tr>
  <td style="vertical-align:top;">LEFT_CONTENT_HERE</td>
  <td style="vertical-align:top;">RIGHT_CONTENT_HERE</td>
  </tr>
  </tbody>
  </table>

• 

  1tess · Moderator Emeritus · Aug 6, 2011 at 6:30 am

  • Copy link

  On another note, you should not be using h tags like this
  <h4>Home</h4>
  to make your text bigger. Those tags has special meanings for search engines. If you want to change the size of text, then use the proper html tags as explained here:
  http://wpbtips.wordpress.com/2009/07/11/formatting-text-pt-5/
  <span style="font-size:120%;">TEXT HERE</span>

• 

  midwaysurf · Member · Aug 6, 2011 at 6:30 am

  • Copy link

  Sorry the new image was on its way..
  That’s great thank you.

• 

  panaghiotisadam · Member · Aug 6, 2011 at 7:01 am

  • Copy link

  Other remarks:

  a) You can fine-tune the vertical positioning of the image by adding a top padding to the table cell or a top margin to the image.

  b) width=100% for the table and text-align:left for a table cell are unnecessary, since that’s the default for tables in TMA.

  c) border=”0″ cellspacing=”0″ cellpadding=”0″ are outdated and don’t work. For the borders see here:

  Overriding default table borders

• 

  1tess · Moderator Emeritus · Aug 6, 2011 at 7:15 am

  • Copy link

  c) right, I just keep copying that code snippet without looking at that part…
  duh! and sorry…

  One can also align the image and text to vertical-align:middle (or bottom).

  Middle looks nice if you have several images one over the other. Then you don’t have to compensate for how much padding looks good in which browser.