Html Question posted in
Some basic documentation can be found here.

Html – CSS how to select the first child only

<div class="item">
 <div><table>1</table></div>
  <div><table>2</table></div>
  <div><table>3</table></div>
</div>

I want to select the table which contains 1,below method doesn’t work:

All the table will be applied, why?

item table:nth-child(1) {
xxxx
}
doesnt work.

Tags:

2

Answers


  1. 0

    You can try this:

    .item div:first-child table {XXX}
    Login or Signup to reply.
  2. 0

    The selector item table:nth-child(1) doesn’t work as expected because :nth-child() selects elements based on their position among siblings, not their overall position in the document structure.
    In your case, each is the first (and only) child of its parent , so all tables match :nth-child(1).

    Final ans ->

    .item > div:first-child table { xxxx }
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search