Форма метки смещения столбца Ant CSS не работает – ReactJS ⇐ CSS

[Anonymous]

I'm new to ReactJs - Ant Design, I want to move the label of the Form item according to the input element but it doesn't work, why the offset column doesn't work? Am I doing something wrong? What steps should I take?

import React, { useState } from 'react'; import './index.css'; import { Button, Form, Input, Radio } from 'antd'; type LayoutType = Parameters[0]['layout']; const App: React.FC = () => { const [form] = Form.useForm(); const [formLayout, setFormLayout] = useState('horizontal'); const onFormLayoutChange = ({ layout }: { layout: LayoutType }) => { setFormLayout(layout); }; const formItemLayout = formLayout === 'horizontal' ? { labelCol: { span: 4 }, wrapperCol: { span: 14 } } : { labelCol: { span: 4, offset: 3 }, wrapperCol: { span: 14, offset: 3 } }; const buttonItemLayout = formLayout === 'horizontal' ? { wrapperCol: { span: 14, offset: 4 } } : null; return ( Horizontal Vertical Inline Submit ); }; export default App; Demo of Ant Design whit Stackblitz: https://stackblitz.com/run?file=demo.tsx

In the above demo I have edit formItemLayout

From

formLayout === 'horizontal' ? { labelCol: { span: 4 }, wrapperCol: { span: 14 } } : null; To
const formItemLayout = formLayout === 'horizontal' ? { labelCol: { span: 4 }, wrapperCol: { span: 14 } } : { labelCol: { span: 4, offset: 3 }, wrapperCol: { span: 14, offset: 3 } };

Источник: https://stackoverflow.com/questions/781 ... rk-reactjs