Skip to main content

5 columnas en una fila con Visual Composer

 

1 En el modo Visual Composer, haga clic en  Agregar elemento  y agregue una  fila .
5 columnas 5 columnas con Visual Composer

5 columnas 5 columnas con Visual Composer

2 Desplace el mouse sobre el ícono de la columna y elija 6 columnas .

5 columnas 5 columnas con Visual Composer

3 Haga clic en el icono Editar fila .

5 columnas 5 columnas con Visual Composer

4 Agregue un nombre de clase adicional (por ejemplo, home_box_wrap). Esta clase servirá como un elemento de destino CSS para anular el estilo predeterminado de las columnas.

5 columnas 5 columnas con Visual Composer

5 Vaya a Apariencia> Editor y agregue los códigos CSS a continuación:

.vc_responsive .home_box_wrap.wpb_row .vc_span2 {
float: left;
width: 18.8%;
padding: 0;
margin-right: 1.5%;
min-height: 0;
}

 

Nota: «.vc_span2» se dirige a la columna individual del diseño de 6 columnas, pero debe 
incluir el contenedor primario de esa fila de VC, que es «.home_box_wrap.wpb_row» y 
también «.vc_responsive», que es una de las » body tag classes» para anular efectivamente los estilos predeterminados.

6 Haga clic en Editar columna en la quinta columna y agregue una clase adicional en la quinta columna, ejemplo (por ejemplo, home_box_last).

5 columnas 5 columnas con Visual Composer

7 Vuelva a Apariencia> Editor , luego agregue este fragmento de CSS para tener un ancho de columna uniformemente distribuido.

.home_box_wrap .home_box_last {
margin: 0 !important;
}

 

8 Publique o actualice

Te invito a seguir a Risi.cl
en Facebook y/o Instagram

DEJA UN COMENTARIO