How to set width in horizontal scrollbar?

[MbF-ArumugamG]

this is my code <Scrollbars renderThumbHorizontal={props => <div {...props} className={styles.thumbhorizontal} />} style={{ height: '175px',}} >

[tegozen]

interface P {
  className: string;
}

interface S {
  height: number
  width: number
  isMounted: boolean
}

export class HorizontalScrollView extends React.Component<P, S> {
  contentConteiner: any;
  state = {
    height: 0,
    width: 0,
    isMounted: false
  }

  componentDidMount() {
    const rect = this.contentConteiner.getBoundingClientRect();
    this.setState({ height: rect.height, width: rect.width, isMounted: true })
  }

  public render(): JSX.Element {
    const { children, className } = this.props;
    const { height, width, isMounted } = this.state;
    const Wrapper: any = isMounted ? ({ children }: any) => <Scrollbars autoHeight>{children}</Scrollbars> : ({ children }: any) => <>{children}</>
    return (
      <div className="w-full">
        <Wrapper>
          <div className="relative w-full overflow-hidden" style={{ height, width }}>
            <div ref={(contentRef) => this.contentConteiner = contentRef} className={`flex absolute left-0 top-0 ${className}`}>
              {children}
            </div>
          </div>
        </Wrapper>
      </div>
    )
  }

  public static defaultProps = {
    className: ''
  }
}