Как сделать элемент формы невидимым для макета? [дубликат] ⇐ CSS

[Anonymous]

У меня возникла проблема с ретроспективным добавлением элемента для обертывания входных данных формы.
Добавление нового элемента html нарушает макет, поэтому я в конечном итоге оказываюсь необходимость дублировать CSS-стиль родительского элемента в .
Чтобы избежать избыточного дублирования стилей, мне было интересно:
a) Есть ли способ (css или html) сделать так, чтобы форма не влияла на родительский макет?
b) Или есть способ автоматического наследования стиль макета из родительского элемента?
Вот пример: я добавил элемент , и он выбросил макет. Я бы хотел, чтобы входные данные располагались вертикально с зазором, без необходимости вручную дублировать/повторно применять родительский стиль CSS.
Например:

Код: Выделить всё

.parent {
display: flex;
flex-direction: column;
border: 2px solid blue;
gap: 20px;
padding: 5px;
}
form {
border: 2px solid green;
}
.child {
border: 2px solid red;
padding: 5px;
}

Код: Выделить всё

Подробнее здесь: https://stackoverflow.com/questions/787 ... -to-layout