Using CSS, how do I set the formatting of just a single cell or a single column?

Question

Using CSS, how do I set the formatting of just a single cell or a single column?

Answer 1

Use the ID selector to target just that one element of the page, in this case, a table cell:

 <tr>
  <td id="foo"></td>
 </tr>

Then in the CSS:

#foo
{
 //-- CSS styling goes here just for this element only
}

That hash symbol (#) marks that name selector as belonging to an id. You can further lock it down in the stylesheet to apply only to a TD cell with that ID like so:

td#foo
{
 //-- CSS styling goes here just for this element only
}

If you add in the rowspan attribute into the TD, you'll be able to turn that into a column and keep the styling you may have set out.

<td id="foo" rowspan="3"></td>

If you mark the CSS selector name with a preceding period (.), like this:

.foo
{
  //-- CSS styles
}

that will target class selectors in the HTML and you can style more than one matching element if you apply the CSS class attribute to the tag, like so:

 <tr>
  <td class="foo"></td>
  <td class="foo"></td>
  <td class="foo"></td>
 </tr>

Don't use CLASS unless it will appear more than once on the page.