Style the first <td> column of a table differently

css css-selectors padding
Shalin picture Shalin · Mar 28, 2013 · Viewed 106.1k times · Source

If I have a table with two columns, how do I specify a padding or any other css so that it is applied just for the first column of <td>s. Also how do I style an n-th column similarly?

Answer

RRikesh picture RRikesh · Mar 28, 2013

You could use the n-th child selector.

to target the nth element you could then use:

td:nth-child(n) {  
  /* your stuff here */
}

(where n starts at 1)

Related questions

Is there a CSS parent selector?

How do I select the <li> element that is a direct parent of the anchor element? As an example, my CSS would be something like this: li < a.active { property: value; } Obviously there are ways of doing …

Read More
CSS selector for first element with class

I have a bunch of elements with a class name red, but I can't seem to select the first element with the class="red" using the following CSS rule: What is wrong in this selector and how do I correct …

Read More
not:first-child selector

I have a div tag containing several ul tags. I'm able to set CSS properties for the first ul tag only: div ul:first-child { background-color: #900; } However, my following attempts to set CSS properties for each other ul tag except the …

Read More