html - 在 iOS 上调整了一个复选框

Question

我有这种意外行为，其中一个复选框被调整大小，而另一个与其 CSS 代码保持一致。这只发生在 iOS 上，包括 Safari 和 Chrome。我正在使用反应。这是我在设备上看到的内容：我的设备 的屏幕截图

代码来了。JSX：

const EmailInput = () => {
    return (
        <div className={'Email-input'}>
            <div className={'Email-input__text'}>
                <input type="email" id="email" size="1" required placeholder='La tua email'></input>
                <Button className={'Email-input__button'}>UNISCITI</Button>
            </div>

                <div className={'Email-input__check'}>
                    <input type="checkbox" id='firstCheck'/>
                    <label htmlFor="firstCheck">Lorem Ipsum is simply dummy text of the printing and typesetting industry</label>
                </div>
                <div className={'Email-input__check'}>
                    <input type="checkbox" id='secondCheck'/>
                    <label htmlFor="secondCheck">It is a long established fact that a reader will be
                        distracted by the readable content of a page when looking at its layout. The
                        point of using Lorem Ipsum is that it has a more-or-less normal distribution of
                        letters, as opposed to using 'Content here, content here', making it look like
                        readable English.</label>
                </div>
            </div>

    )
}

和 CSS

.Email-input__check {
    display: flex;
    margin-bottom: 1rem;
}

.Email-input__check input[type="checkbox"] {
    margin: 0 1rem 0 0;
}

.Email-input__check label {
    color: #989898;
}

非常感谢你的帮助！

标签： htmlcssiosreactjs