How to select first and last TD in a row

Question

How can you select the first and the last TD in a row   tr  gt  td 0   tr  gt  td -1       styles

User · Accepted Answer

You could use the  first-child and  last-child pseudo-selectors   tr td first-child  tr td last-child          styles        This should work in all major browsers  but IE7 has some problems when elements are added dynamically  and it won t work in IE6

User · Answer

If the row contains some leading  or trailing  th tags before the td you should use the  first-of-type and the  last-of-type selectors  Otherwise the first td won t be selected if it s not the first element of the row    This gives    td first-of-type  td last-of-type          styles

User · Answer

You could use the  first-child and  last-child pseudo-selectors   tr td first-child      color red    tr td last-child       color green     Or you can use other way like     To first child  tr td nth-child 1       color red        To last child  tr td nth-last-child 1       color green      Both way are perfectly working

User · Answer

If you use sass scss  you can use the following snippet   tr  gt  td        styles for all td       amp  first-child          styles for first              amp  last-child         styles for last

User · Answer

You can use the following snippet     tr td first-child  text-decoration  underline     tr td last-child  color  red     Using the following pseudo classes    first-child  means  select this element if it is the first child of its parent      last-child means  select this element if it is the last child of its parent     Only element nodes  HTML tags  are affected  these pseudo-classes ignore text nodes

[css] How to select first and last TD in a row?

Examples related to css

Examples related to css-selectors