How to remove border around Pager on a table?

[Torsten_Giesbrecht1]

I want to remove the border around the pager on a table component. When trying to give rounded edge you can still see the non rounded border.

I’ve tried:

.ia_pager {
    box-shadow: none !important;
    border: none !important;
}
.pager-container {
    box-shadow: none !important;
    border: none !important;
}
.bottom {
    box-shadow: none !important;
    border: none !important;
}
.pager-container.ia_pager.bottom {
    box-shadow: none !important;
    border: none !important;
}

I can adjust the border radius and background-color with .ia_pager.

[djs]

In the table props, you can add a border-radius on the table itself as well as the pager:

If the values match, it should look like this:

The advanced stylesheet shouldn't be necessary.

(A note about defining classes in CSS)

When specifying a style for multiple classes, separate them with a comma and a space. Like this:

.pager-container, .ia_pager.bottom {
    box-shadow: none !important;
    border: none !important;
}

[Torsten_Giesbrecht1]

Thanks @djs . I matched my settings exactly and till get this:

When I specify a bright border in pager you can clearly tell that the unwanted border I’m talking about is not really part of the ia_pager class:

But even the css code you provided didn’t work.

[Torsten_Giesbrecht1]

For some reason this very specific setup did the trick for me:

.pager-container, .pager {
    border: none !important;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    box-shadow: none !important;
}