Print

The nth child pseudo class is unique to css3.  It can be used with any element type.  Great for tables.

elementType:nth-child(value){

  property:value;

  ...

  }

Replace elementType with the element you are styling. 

Replace value with a keyword or number to indicate which child you want the styling to apply to.  Value accepts two key words odd or even. When odd or even is used with row such as tr{...} it will affect the whole role.  Odd would be 1,3,5,.. rows and Even would be 2,4,6, .. rows.  If you want to work with columns then you would need to identify the data cell within the row.  An example would be

/* Applies to data cell 2 in each table row */

td:nth-child(2){

   text-align:center;

}

Replace property:value with any number of CSS property:value pairs you want to use.

Comments (0)

500 characters remaining

Cancel or