Clinical Trials Search Pager Spacing, Wrapping and Stacking Issues

[meglake]

Basic Information

Issue: The pager at the top of the screen for the Clinical Trials Search is spreading out as the screen size increases, and it wraps the "Next >" button underneath the "< Previous" button when on any page after 1. More wrapping occurs on smaller screen sizes, see the screenshots below. This is occurring on Chrome, FF, and Edge.

Desired Outcome: The pager should remain on one line and the distance between page numbers should not increase as the screen size increases.

Steps to Reproduce

1. Go to https://www-test-acsf.cancer.gov/about-cancer/treatment/clinical-trials/search/r?loc=0&pn=3&rl=1
2. Ensure that a page after 1 is selected. (Page 3 is selected on screenshots)
3. View the page at the widescreen breakpoint or larger (>1024px)
4. Observe that the "Next >" button is wrapped below the "< Previous" button, and the page numbers have an increased distance between them
5. View the page at the Mobile Large breakpoint (680px)
6. Observe that the pager is on its own line, but has still wrapped the "Next >" button below the "< Previous" button, and the page numbers have an increased distance between them
7. View the page at the Mobile breakpoint or smaller (<480px)
8. Observe that multiple page numbers, the ellipses, and the "Next >" button have all wrapped to the second line, and the page numbers have an increased distance between them

Screen Shots

Wrapping at 1025px

Wrapping at 680px

Wrapping at 479px

Here's a screenshot of what it looked like on ACSF Dev:

Here's a screenshot of what it looks like on PROD:

[meglake]

Canceling ticket, this issue was due to cache not clearing after set up.