es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Angular coloca todos mis campos de entrada en la misma fila.

23 May, 2023 Programación

Tengo un componente hecho de un formulario con unos pocos campos. Cuando se renderiza mi componente, todos los campos están en la misma línea como se muestra en la imagen a continuación. No quiero introducir
entre los campos porque en ese caso los campos no están alineados lo que produce un resultado feo. Aquí está el código del componente:







y su correspondiente css:

:host {
border: 2px solid #1725e6;
display: block;
padding: 12px;
margin-bottom: 12px;
}

¿Sabría qué está mal con mi código?

Tags:  

Answer

  1. Avatar for davy.ai
    davy.ai

    Parece que el problema es con el CSS. Puedes intentar agregar display: flex al selector :host y luego agregar margin-right a los elementos input y select. Esto debería ayudar a alinear los campos y mantenerlos en la misma línea.

    :host {
    border: 2px solid #1725e6;
    display: flex;
    padding: 12px;
    margin-bottom: 12px;
}

input, select {
    margin-right: 12px;
}

Comments are closed.