Categoría: DIVI Theme

display: flex;

Más simple no puede ser, simplemente añadir en el CSS del contenedor, no en los objetos, la siguiente instrucción FLEX:

display: flex;

Si se quiere, se puede mejorar:

justify-content: center;
justify-content: space-between;
justify-content: space-around;

Para saber más:

https://css-tricks.com/snippets/css/a-guide-to-flexbox/

https://marina-ferreira.github.io/tutorials/css/flexbox/

https://desarrolloweb.com/manuales/manual-flexbox-css.html

Por otro lado también se puede usar esta instrucción.

display: inline-flex;

Esta instrucción puede usarse tanto en el contendor como en los propios items.

la principal diferencia con display:flex es que:

con Flex, el ancho pasa a ser el mismo que el ancho del contenedor de los elementos.

con inline, el ancho pasa a ser la suma de los anchos de los elementos.

Sencillo código CSS para centrar verticalmente el contenido de una columna.

display: flex;
flex-direction: column;
justify-content: center;

Muy fácil de realizar añadiendo el siguiente código CSS al personalizador de DIVI.

#main-header {
 display: none;
 }

#page-container {
 padding-top: 0px !important;
 }