和按钮className样式不工作

Question

面对使用and Button的问题;需要对齐按钮在右边。是的，它可以与style={{float:"right"}}一起工作，但需要在className属性中设置它的样式。

<Button className={styles.myButtonOne} type="default" htmlType="button"> My Button</Button>

.myButtonOne {
float: right;
}

这是不工作，虽然使用浮动左myButtonOne。但是下面的代码可以正常工作:

<Button style={{float:'right'}} type="default" htmlType="button"> My Button</Button>

需要在className中使用样式。

Answer 1

根据@Layhout的评论，Button上没有className属性，所以你可以将按钮包装在div中，并将该div命名为className={styles.myButtonOne}

Answer 2

import React from 'react'
import { Button } from 'antd'
import styled from 'styled-components'
const StyledButton = styled.div`
& .my-btn {
float: right;
}
`
const Page = () => {
return (
<StyledButton>
<Button className="my-btn" type="default" htmlType="button">
My Button
</Button>
</StyledButton>
)
}
export default Page