“Antd”库中的组件垂直和水平居中不起作用

import React from 'react';
import { Card } from 'antd';

const App = () => {
  return (
    <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '100vh' }}>
      <Card title="Centered Card">
        This card is centered both horizontally and vertically.
      </Card>
    </div>
  );
};

export default App;

import React from 'react';
import { Card } from 'antd';

const App = () => {
  return (
    <div style={{ display: 'grid', place-items: 'center', height: '100vh' }}>
      <Card title="Centered Card">
        This card is centered both horizontally and vertically.
      </Card>
    </div>
  );
};

export default App;

import React from 'react';
import { Card } from 'antd';

const App = () => {
  return (
    <div style={{ height: '100vh', width: '100vw', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
      <Card title="Centered Card">
        This card is centered both horizontally and vertically.
      </Card>
    </div>
  );
};

export default App;