0 votes
in Education by (1.7m points)
I have something like this

<table>

  <tr>

    <td>First table</td>

  </tr>

</table>

<table>

  <tr>

    <td>Second table</td>

  </tr>

</table>

And the following CSS

table {

  margin-bottom:40px;

}

table:last-child {

  margin-bottom:0px;

}

But the second table still gets margin-bottom applied. Wat do?

JavaScript questions and answers, JavaScript questions pdf, JavaScript question bank, JavaScript questions and answers pdf, mcq on JavaScript pdf, JavaScript questions and solutions, JavaScript mcq Test , Interview JavaScript questions, JavaScript Questions for Interview, JavaScript MCQ (Multiple Choice Questions)

1 Answer

0 votes
by (1.7m points)
@Quentin is right that your code does not reproduce your described problem.

I'm going to guess what the problem is.

table:last-child does not mean "the last table in the parent element".

It actually means "the last element in the parent element if it's a table".

For example, given this HTML table:last-child will not select anything:

<div>

    <table>

        ..

    </table>

    <table>

        ..

    </table>

    <div>I'm the last child</div>

</div>

Related questions

...