HTML Table Format

• 

  kathrynwp · Staff · Dec 4, 2012 at 3:14 pm

  • Copy link

  languageomnivore – to control the width of table cells, the best method is to separate the CSS from the table code. For example, let’s say you want some of your table cells to be 100 pixels wide.

  In your CSS you can add something like this:

  .mycell1 {
width: 100px;
}

  Then your table might look like this:

  <table>
<tr><td class="mycell1">data</td><td class="mycell1">data</td>
</tr>
</table>

  Here are some CSS basics you might find helpful:

  http://en.support.wordpress.com/custom-design/css-basics/

  If you need further help with your tables, please start a new thread so we can assist you there.

• 

  languageomnivore · Member · Dec 4, 2012 at 3:29 pm

  • Copy link

  Very helpful, Kathryn! Thanks for your answer.

• 

  kathrynwp · Staff · Dec 4, 2012 at 3:35 pm

  • Copy link

  testcricketleague – to get your new tables looking like the old ones, you’ll just need to add some padding to your cells as needed.

  I added padding:2px; to the cells in your first table so you can see how this looks.

  A much more efficient way to style your tables would be by separating your styles from your table code, as you can see in the example I gave just above. If you have any questions, just let me know.

• 

  testcricketleague · Member · Dec 5, 2012 at 10:14 pm

  • Copy link

  Thanks, kathrynwp. When you added the padding to the cells, did you have to manually insert ‘padding:2px;’ into each line of text or is there a quicker way of doing this? (I don’t have the CSS upgrade.) As you may have seen, I use a lot of tables on my site and having to manually insert all those padding commands would be laborious in the extreme.

  Also, does the padding create extra space on the top and bottom of each cell as well as the left and right? The table that you amended is noticeably taller than previously.

  Is there any chance that a future WordPress update might deal with this problem and return my tables to the format under which they were originally displayed?

• 

  kathrynwp · Staff · Dec 6, 2012 at 5:49 pm

  • Copy link

  When you added the padding to the cells, did you have to manually insert ‘padding:2px;’

  Yes.

  is there a quicker way of doing this?

  I tested a number of methods on your post but couldn’t find a quicker method.

  Also, does the padding create extra space on the top and bottom of each cell as well as the left and right?

  Yes. If you want padding only on the left and right you can modify the code to this: padding: 0 2px;

  Is there any chance that a future WordPress update might deal with this problem and return my tables to the format under which they were originally displayed?

  Unless I can find the root of the problem, unfortunately not. I examined the code in both your posts but wasn’t able to see a difference. Perhaps you could create two smaller test posts (you can leave them as drafts) so there is a bit less code to look through. Again, one with a post that doesn’t have the correct padding, and one that does – but perhaps with only a single table this time. I’d be glad to give it another try.

• 

  testcricketleague · Member · Dec 9, 2012 at 10:14 pm

  • Copy link

  I’ve just been checking my site and I’m glad to say that the issue with the spacing seems to have been resolved. Everything seems to be back to the way it was before the problem with the tables arose.

  Many thanks for all your help with this, kathrynwp. It’s very much appreciated.

• 

  kathrynwp · Staff · Dec 10, 2012 at 3:12 pm

  • Copy link

  Very glad to hear this!

  If you have any issues in the future feel free to start a new thread.