He estado probando en poder acomodar texto, al lado de un checkbox. Pero no logro que este se posicione en donde quiero. Probé con position: absolute; Pero si hago esto y después achico la pantalla se me rompe el diseño. Por lo que estoy en busca de una solución donde quede el checkbox, y el texto al lado, pero sin usar absolute. Después mi idea es posicionar el checkbox junto con el texto para que quede alineado verticalmente con las otras partes del formulario.
.S-Formulario {
background-color: #Bc6c25;
border: #572b05 solid;
display: flex;
padding: 5%;
height: 70%;
width: 60%;
border-radius: 2%;
margin: 5% auto;
}
.Formulario {
height: auto;
width: 100%;
display: flex;
flex-direction: column;
}
.Formulario input, select {
margin:1%;
height: 10%;
width: 100%;
}
.Formulario textarea {
margin: 1%;
width: 100%;
height: 30%;
}
#checkbox{
width: 40%;
}
<section class="S-Formulario"><!-- Formulario -->
<form action="" method="" enctype="" class="Formulario">
<input type="text" name="" id="Nombre" placeholder="*Ingrese su nombre" required>
<input type="email" name="" id="Mail" placeholder="*Ingrese su mail" required>
<select name="" id="Tipo de consulta" required>
<option value="1" disabled selected>*Tipo de consulta o comentario</option>
<option value="2">Información productos</option>
<option value="3">Información de venta</option>
<option value="4">Comentario</option>
<option value="5">otro</option>
</select>
<textarea name="" id="" cols="30" rows="10" placeholder="*Ingrese su Comentario/Consulta" required></textarea>
<input type="checkbox" name="opcion" id="checkbox">
<p class="Text-checkbox">
Quiero recibir información sobre las novedades de Dernocua
</p>
<input type="submit" value="enter">
</form>
</section>