Pagination pagesize won't show in mobile view in antd Table react js

Question

So in old version 4.xx of antd it worked fine always, i decided to migrate to latest version now pagination position works but i have setshowSizeChanger but wont show if i open or view site on mobile view

pagination={{ position: ['topRight', 'bottomRight'], showSizeChanger: true }}

this is prop I gave into Table component, pages are there but size changer hides in mobile, on desktop it works fine, any way to make size change true always for mobile and desktop

I have tried in old version it works fine for both mobile and desktop and also I tried a clean project with Table component and data but issue is same on new project too with newer version, any help is appreciated thanks

Answer 1

I have inspected the code, and I found that it's because when the screen is smaller than 576px, the pageSizeChanger will become display none.

@media only screen and (max-width: 576px) {
    .ant-pagination .ant-pagination-options {
        display: none;
    }
}

Hence, I just override the antd css although its says not to override. Here's my code in global.css

@media only screen and (max-width: 576px) {
    .ant-pagination .ant-pagination-options {
        padding-top: 10px;
        display: block;
    }
}