Esto es lo que hay, tres elementos dentro de un contenedor:
Este es el HTML:
Ahora podemos alinear verticalmente aplicando
Y aqui el CSS:
Este es el CSS:
#container{ height: 400px; width: 700px; background-color: orange; } #item{ height: 100px; width: 200px; background-color: yellow; border: 1px solid black; }Primero hay que agregar la propiedad de
display:inline-block;
a los items para que se ordenen en una sola lineadisplay:flex; align-items:center
en el contenedor y margin:0 auto;
en los elementos internos para alinear horizontalmente. El resultado:#container{ height: 400px; width: 700px; background-color: orange; display:flex; align-items:center; } #item{ height: 100px; width: 200px; background-color: yellow; border: 1px solid black; display: inline-block; margin: 0 auto; }
No hay comentarios:
Publicar un comentario