Making it work?

[greggman]

I'm probably doing something really dumb but I tried to get this to work here

https://codesandbox.io/s/qx185m784q

And no luck. Any ideas?

import React from 'react';
import { render } from 'react-dom';
import PerfectScrollbar from 'react-perfect-scrollbar';
import Hello from './Hello';

import 'perfect-scrollbar/dist/css/perfect-scrollbar.css';

const styles = {
  fontFamily: 'sans-serif',
  textAlign: 'center',
};

const App = () => (
  <div style={styles}>
    <Hello name="CodeSandbox" />
    <div style={{
      border: '1px solid black',
      height: '200px',
      overflow: 'auto',
    }}>
    <PerfectScrollbar>
    <h2>Start editing to see some magic happen {'\u2728'}</h2>
    <h2>Start editing to see some magic happen {'\u2728'}</h2>
    <h2>Start editing to see some magic happen {'\u2728'}</h2>
    <h2>Start editing to see some magic happen {'\u2728'}</h2>
    <h2>Start editing to see some magic happen {'\u2728'}</h2>
    <h2>Start editing to see some magic happen {'\u2728'}</h2>
    <h2>Start editing to see some magic happen {'\u2728'}</h2>
    <h2>Start editing to see some magic happen {'\u2728'}</h2>
    <h2>Start editing to see some magic happen {'\u2728'}</h2>
    <h2>Start editing to see some magic happen {'\u2728'}</h2>
    </PerfectScrollbar>
    </div>
  </div>
);

render(<App />, document.getElementById('root'));

[goldenyz]

Please replace the css import with

import 'perfect-scrollbar/dist/css/styles.css'

and have a try again.

[greggman]

I think you meant

import 'react-perfect-scrollbar/dist/css/styles.css';

That works.

maybe update the docs? Or did I mis-understand? There is no file perfect-scrollbar/dist/css/styles.css but that's what your README says

[goldenyz]

My fault. Thanks for the feedback.