Pagination control is not displaying correctly in angular app?

[fahadsubzwari924]

I have an angular app in which i am implementing pagination using ngx-pagination but pagination controls is not displaying correctly.

I have html regarding pagination in my html.component.html

         `<div class="col-12 text-center">
                <pagination-controls id="hmPage" (pageChange)="crntPage = $event" directionLinks="true" autoHide="false" responsive="true" previousLabel="Back" nextLabel="Next">
                </pagination-controls>
          </div>`

pagination control are not displaying correctly. I uploaded pagination view screenshot here Please see and let me know what's the problem in there?

[michaelbromley]

Without a live reproduction I cannot say exactly, but I suspect some kind of conflict caused by your existing css styles - perhaps they already have rules which match some of the selectors for the pagination controls component?

[fahadsubzwari924]

If any classes are conflicting with ngx-paginaiton classes so how can i detect those classes?

[michaelbromley]

Use your browser devtools to inspect the CSS being applied to the given element: https://developers.google.com/web/tools/chrome-devtools/css

[fahadsubzwari924]

I have fixed the issue. My own class were conflicting. But now there is another issue. When i click on Next button to go to another page so page automatically scrolls to bottom. Do know what this issue is?

[michaelbromley]

Glad you fixed the first issue. Cannot advise on the scrolling issue without seeing some code or ideally a reproduction on Stackblitz.