How change Ant design Tooltip width

Question

I want to change the width of the tooltip, but I can't.
How do I do this?

import React, { FunctionComponent } from 'react';
import {Tooltip} from "antd";
import 'antd/dist/antd.css';

export interface Props {
  tooltipeText: string
}

const hintWithTooltipeStyle = {
  position: 'relative' as 'relative',
  left: 5,
  top: 1
};


const HintWithTooltipe: FunctionComponent<Props> = ({
  tooltipeText
}: Props) => {
  return (
    <span style={hintWithTooltipeStyle}>
      <Tooltip placement="rightTop" title={tooltipeText} style={{width: 700, maxWidth: '500px !important'}}>
        <Button>Ant design</Button>
      </Tooltip>
    </span>
  );
};

export default HintWithTooltipe;

Inline styles don't work.
No styles work at all

Answer 1

The antd Tooltip can be adapted by overriding values in css class .ant-tooltip-inner.

.ant-tooltip-inner {
  color: yellow;
  background-color: green;
  width: 200px;
}

Here is a working CodeSandBox have a look at the index.css file for changes.