Search code examples
csscss-selectorscss-specificity

how to override the `class-name > *:last-child` in css globally

If I want to override a css class where specificity is not working, I use the following format which works well.

div[class="class-name"] {
        padding-bottom: 0;
    }

But how to override the class in the form bx--modal-content > *:last-child ? The following is not working.

div[class="bx--modal-content > *:last-child"] {
        padding-bottom: 0;
    }
Solution

  • The selector should be 

    div[class="bx--modal-content"] > *:last-child {
  padding-bottom: 0;
]

    The > *:last-child isn't part of the class, so it shouldn't be inside the [ ... ] brackets.