ANTD无线电圈落在外面

发布于 2025-01-17 17:44:30 字数 340 浏览 1 评论 0原文

我在React JS应用中使用单选按钮。最近，我注意到在无线电按钮中，Cicrle掉入按钮外。我以为可能的边距，桨板有问题。但是，当我删除所有边距，样式，classNames等时。问题仍然没有消失。当我尝试在另一个页面中使用相同的ANTD组件时，这是同一问题。我没有在index.css中使用任何特定样式 antd Radio以前有人遇到过这个问题抱歉，我没有提供任何代码。但是我什至没有任何要提供的东西。我删除了所有可能

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

奢华的一滴泪 2025-01-24 17:44:30

为组件创建CSS文件，并添加以下CSS。您的问题很可能是由于位置属性，该属性由其他某些CSS

position overriden构成应该是位置：absolute;

default antd 应如下所示

.ant-radio-inner::after {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: 16px;
    height: 16px;
    margin-top: -8px;
    margin-left: -8px;
    background-color: #1890ff;
    border-top: 0;
    border-left: 0;
    border-radius: 16px;
    transform: scale(0);
    opacity: 0;
    transition: all 0.3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
    content: ' ';
}

.ant-radio-inner :: 在位置属性从上面的班级中删除时，

。 property

添加position：absolute;属性：

我希望这对您有帮助。

Create a css file for your component and add the following css. Your issue is most probably due to the position property which is overriden by some other css

position should be position: absolute;

default antd .ant-radio-inner::after should be as follows

.ant-radio-inner::after {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: 16px;
    height: 16px;
    margin-top: -8px;
    margin-left: -8px;
    background-color: #1890ff;
    border-top: 0;
    border-left: 0;
    border-radius: 16px;
    transform: scale(0);
    opacity: 0;
    transition: all 0.3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
    content: ' ';
}

When position property is removed from above class you get this issue, check the following screenshot

After removing position: absolute; property