¡Hola Comunidad!
Necesito alinear hacia la izquierda unos elementos que tengo en un div contenedor, he leído varios tutoriales en ingles y español de StackOverflow pero no me funcionan y la mayoría utilizan porcentajes en el ancho de los elementos mientras que los míos son definidos en pixeles.
Para distribuirlos utilizo Flexbox con justify-content: space-evenly debido que al momento de hacerlo responsive me agrada mas el espacio que hay entre los elementos que con cualquier otra propiedad.
Adjunto imágenes:
Como se ve ahora:
Como quiero que se vea:
Ya por ultimo dejo el código y espero que me ayuden a encontrar una solución:
* {
margin: 0;
padding: 0;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
box-sizing: border-box;
}
.Contenedor {
width: 90%;
max-width: 880px;
margin: 0 auto;
padding: 30px 0;
display: flex;
justify-content: space-evenly;
flex-wrap: wrap;
background-color: #f5f5f5;
}
.Elemento {
width: 210px;
height: 280px;
margin-top: 10px;
padding: 10px;
position: relative;
border-radius: 4px;
border: 1px solid #cccccc;
background-color: #ffffff;
}
<div class="Contenedor">
<div class="Elemento"></div>
<div class="Elemento"></div>
<div class="Elemento"></div>
<div class="Elemento"></div>
<div class="Elemento"></div>
<div class="Elemento"></div>
<div class="Elemento"></div>
</div>