Como hago para centrar correctamente el buscador?, siempre me sale así ![]( este es mi css: <code> .input{ border: 2px solid white; ...

Nicolas Villabona

Pregunta

student•hace 5 años

Como hago para centrar correctamente el buscador?, siempre me sale así

![](

este es mi css:

  .input{
    border: 2px solid white;
    border-radius: 30px ;
    background-color: rgba(255, 255, 255, 0.1);
    font-family: 'Muli', sans-serif;
    font-size: 16px;
    height: 50px;
    padding: 0px;
    width: 70%;
    outline: 0px;
    display: flex;
    align-items:center;
    justify-content: center;
    flex-direction: column;
  }```

Percy Buendia

student•hace 4 años

flexbox modifica los elementos dentro de la caja. En este caso si quieres alinear "input", debes aplicar flex a la caja padre

Gonzalo Pozzoli

student•hace 5 años

Tenes que modificar la sección main, no el input. Es decir tenes que alinear al elemento padre.

.main{
   display: flex;
   align-items: center;
   flex-direction: column;  
}

Wilson Orlando Capacho Carmona

student•hace 5 años

cuando tengas problemas con tu código, te recomiendo trabajar en esta pagina y guardar tus trabajos para que otros te puedan ayudar...es super padrisima y facilita enormemente que otros te puedan ayudar en tus proyectos https://codepen.io/

Wilson Orlando Capacho Carmona

student•hace 5 años

yo tambien tenia el mismo problema...pero le agregue en el input

margin: 0% auto;

y me funciono

Jesus M Cocaño Diaz

student•hace 5 años

input esta dentro de la seccion, intenta hacerlo ahi

Como hago para centrar correctamente el buscador?, siempre me sale así ![]( este es mi css: <code> .input{ border: 2px solid white; ...

Curso de Frontend Developer

Curso de Frontend Developer