Topic: table cells: NO margin/padding/etc -- help!

Being a bit noob to CSS, I'm stuck on something that seems like it really ought to be simple (isn't that always the way?)

Back in the old days, when I wanted table cells to get cozy with each other, I'd specify cellspacing="0" and cellpadding="0" on the <table> element.

Here in the new-fangled CSS era, I'm trying to do the "right thing" and specify all my formatting in CSS, but CSS does not seem to have any equivalent properties that let me specify that I want exactly zero space between adjacent table cells.  I've tried scattering "margin: 0px; padding: 0px;" all over my CSS file (on the relevant table, tr, and td styles) to no effect, and I can't think what else to try.

Help?

Re: table cells: NO margin/padding/etc -- help!

This might help if you put it in your CSS file:

  td {
    border-spacing:5px;
  }


If not then try this approach:

Put something like this in your CSS file:

  #table1 {
    border-collapse: collapse;
  }
  #table1 td {
    border: 2px solid white;
  }

And then try this in your template or partial:

  <table id="table1">
    <tr>
      <td>AAA</td>
      <td>BBB</td>
      <td>CCC</td>
    </tr>
    <tr>
      <td>AAA</td>
      <td>BBB</td>
      <td>CCC</td>
    </tr>
    <tr>
      <td>AAA</td>
      <td>BBB</td>
      <td>CCC</td>
    </tr>
   </table>

It's more than likely that some combination of these approaches will fix the problem.

Re: table cells: NO margin/padding/etc -- help!

cloister wrote:

Here in the new-fangled CSS era, I'm trying to do the "right thing" and specify all my formatting in CSS, but CSS does not seem to have any equivalent properties that let me specify that I want exactly zero space between adjacent table cells.  I've tried scattering "margin: 0px; padding: 0px;" all over my CSS file (on the relevant table, tr, and td styles) to no effect, and I can't think what else to try.

If you don't already have Firefox installed on your system, I highly suggest you do so - it won't interfere with your platform's default web browser.

Then get the Firebug plug-in for Firefox - it will save you countless hours debugging HTML/CSS issues.

HTH,

Jim