Olá! Entendi que você está tentando colocar vários inputs juntos e está tendo dificuldades para posicionar os elementos.
Primeiro, é importante lembrar que no HTML, os elementos são empilhados de cima para baixo por padrão. Para alterar isso, você pode usar CSS.
Vou te dar um exemplo de como você pode criar um formulário com vários inputs usando HTML e CSS.
<form>
<div class="input-group">
<label for="campo1">Campo 1</label>
<input type="text" id="campo1" name="campo1">
</div>
<div class="input-group">
<label for="campo2">Campo 2</label>
<input type="text" id="campo2" name="campo2">
</div>
<!-- Repita o bloco acima para os 19 campos -->
</form>
E no CSS:
.input-group {
display: flex;
flex-direction: column;
margin-bottom: 10px; /* Espaçamento entre os campos */
}
Nesse exemplo, cada grupo de entrada (label + input) é envolvido por uma div com a classe "input-group". No CSS, definimos essa classe para ter uma direção de flexão em coluna (ou seja, os elementos dentro dela são empilhados verticalmente), e um espaço entre cada grupo.
Espero que isso te ajude a criar o formulário que você precisa! Lembre-se de que o CSS é uma ferramenta poderosa para controlar o layout e a aparência dos seus elementos HTML, então não hesite em experimentar e ver o que funciona para você.
Espero ter ajudado e bons estudos!