Extra arrows on pagination are displaying

What package(s) are you using?

• carbon-components
• [x ] carbon-components-react

Detailed description

Describe in detail the issue you’re having. On the pagination component where it asks ‘Items per page’ and ‘page’, there is an extra up and down arrow displaying next to the number, while the original down arrow that should be displayed is over the number indicating the page number or number of objects being displayed. The issue disappears once I use the Chrome developer tools and use the toggle device toolbar. I also tried testing this in Firefox and the down arrow is no longer underneath the numbers (but there’s still two dropdown arrows).

Is this issue related to a specific component? pagination component from ‘carbon-components-react’

What did you expect to happen? What happened instead? What would you like to see changed?

I would like the component to display what is shown in the Carbon Documentation for Pagination. Right now, there is an extra up/down arrow next to the page and input numbers and the original arrow is underneath the selected number

What browser are you working in? Chrome

What version of the Carbon Design System are you using? “carbon-components”: “^10.9.3”, “carbon-components-react”: “^7.12.0”,

What offering/product do you work on? Any pressing ship or release dates we should be aware of?

Steps to reproduce the issue

1. Step one In a react application, import the Pagination component from ‘carbon-components-react’.

2. Step two Use the example provided by the carbon 10 documentation for pagination. https://www.carbondesignsystem.com/components/pagination/usage/

3. Step three Run the app in Chrome

4. etc.

Please create a reduced test case in CodeSandbox https://codesandbox.io/s/thirsty-paper-jik93?file=/src/index.js

• Style and vanilla JS: https://codesandbox.io/s/github/carbon-design-system/carbon/tree/master/packages/components/examples/codesandbox
• React: https://codesandbox.io/s/github/carbon-design-system/carbon/tree/master/packages/react/examples/codesandbox

Additional information

• Screenshots or code

• Notes

[David-Yuen]

Update: I’ve added postcss-loader and autoprefixer to our build and it’s working. Thanks! this resolves the issue

[tw15egan]

Going to close this as I would assume the original issue can be resolved in the same way 👍