Introducción
Cuando estamos construyendo nuestro sitio en Divi seguramente nos hemos encontrado con la siguiente situación
Una sección con dos columnas, donde una de ellas tiene un elemento considerablemente mas alto que el otro. A continuación, vamos a ver cómo, por medio de unos ajustes muy simples, podemos alinear verticalmente elementos acorde a la altura mas pronunciada de la columna adyacente.
Pasos para alinear verticalmente el contenido
Primero que nada, vamos a hacer que nuestra fila tenga habilitada la opción de igualar las alturas de las columnas; dicha opción la encontramos al editar la fila dirigiéndonos a Diseño-> Tamaño
Seguido de ello, vamos a dirigirnos a la columna donde se encuentra el contenido que deseamos alinear y vamos a agregar una simple linea de estilos CSS. Nos dirigimos a las opciones de edición de la fina Avanzado-> CSS personalizado-> Elemento principal
La linea que vamos a agregar de CSS es la siguiente:
align-self: center;
Lo que nos dará como resultado lo siguiente
Muy simple, ¿verdad? pero aun hay mas, la linea que acabamos de agregar podemos cambiar su posición haciendo que el contenido este alineado en el extremo mas superior (El cual seria la posición por defecto del elemento) y el extremo mas inferior, veamos ambos casos
Alineación al inicio
Con la siguiente linea, va al inicio de la columna en relación de la altura de la columna adyacente
align-self: flex-start;
Alineación al final
En este caso, la linea va al final de la columna en relación de la altura de la columna adyacente
align-self: flex-end;
Conclusiones
Como podemos apreciar, en la situación anterior, la posible solución mas directa hubiese sido el aplicar paddings al contenido hasta que tomase la alineación a nuestro gusto; ahora, con los estilos sugeridos podemos hacerlo mucho mas preciso y con considerablemente menos esfuerzo.
Si te ha gustado esta publicación y te interesa seguir aprendiendo mas tips y mejorar en la construcción de tus sitios utilizando Divi puedes echarle un vistazo a los cursos gratuitos que tenemos al respecto