Layout y Spacing

Cuando se arrastran elementos muy grandes, se arrastran elementos a una distancia muy larga, o cuando se crea una anidación complicada,  a menudo el Panel de Estructura es  una forma más fácil de posicionar el elemento donde se quiere.

Haz clic en el conmutador de Structure, cerca de la esquina superior derecha de la pantalla, para abrir el Panel de Estructura, a continuación, haz clic en la zona de puntos y arrastra un elemento para reposicionarlo. Siempre resulta mas efectivo el movimiento hacia arriba, por lo que si tienes problemas, prueba a hacer el movimiento hacia arriba en la medida de lo posible.

AJUSTAR EL ESPACIO DE LOS ELEMENTOS
El espacio alrededor y dentro del elemento activo puede ajustarse arrastrando las barras púrpuras de espaciado alrededor del límite del elemento.
En primer lugar, activa el elemento para el que desea ajustar el espaciado haciendo clic ken él; a continuación, sitúa el puntero del ratón sobre el borde interior o exterior del elemento hasta que aparezca una barra de arrastre de color púrpura.
Haga click y arrastra la barra para ajustar el espaciado.

Las fechas circulares corresponden a las acciones de Deshacer y Rehacer, mientras que la figura que está al lado con el texto Structure sirve para mostrar u ocular el Panel de Estructura.  Así mismo, abajo tenemos un detalle del Panel de Historial, con el que se pueden revertir los cambios que se han realizado basándose en la hora en las que fueron realizados.

-- ESPACIADO -- (Spacing)

Pasa el ratón por encima del borde de un elemento para que aparezca la barra de arrastre del espaciado. Hacer click y arrastrar esta barra para ajustar el espaciado.

Hay dos tipos de espaciado:

• Padding (Relleno) - espacio dentro de un elemento.
• Marging (Margen) - espacio fuera de un elemento.
• En lugar de utilizar la barra de arrastre, puedes especificar manualmente estos valores en Advanced > Size & Spacing (Avanzado > Tamaño y espaciado).

LA CUADRÍCULA CSS ESTÁ DISPONIBLE COMO OPCIÓN DE DISEÑO EN LOS ELEMENTOS SECTION, DIV, GALLERY, EASY POSTS Y REPEATER.
Puedes obtener más información sobre Grid aquí y aquí también.

-- GRID LAYOUT -- (Diseño de rejilla)

Hay una casilla de verificación para Activar/Desactivar la cuadrícula CSS

--Rows-- (Filas)

Comportamiento de las filas o Rows

• Auto: Se utilizará, de manera automática, el número correcto de filas en función de la cantidad de elementos que tengas en el Grid (cuadrícula)
• Explicit: Aquí eres tú el que establece la cantidad de filas y las alturas mínimas y máximas.
• Row Count: Se establece el número de filas que quieres en la cuadrícula.
• Min Height: Altura mínima de las filas.
• Max Height: Máxima altura de las fila.
• Match Height of Tallest Child: Esta opción hace que todas las filas tengan la misma altura, basándose en el el valor de rejilla mas alto.
• Gap: Establece el espaciado o separación entre filas.
• Vertical Item Alignment (Start, Center, End, Stretch): Cuando la rejilla no ocupa  toda al altura disponible, este ajuste alineará el contenido dentro de su celda de la cuadrícula basándose en la selección de la alineación vertical del elemento.

--DEFAULT CHILD SPAN-- (Espaciado por defecto)

• Column Span (Extensión de Columna):  Establece el número por defecto  de columnas que abarque cada elemento.
• Row Span (Extensión de Filas): Establece el número de filas que queremos que abarque cada elemento por defecto.

--CHILD SPAN OVERRIDE-- (Anulado de la extensión)

Este control refleja el número de elementos de la rejilla. Se hace click en uno de ellos para establecer explícitamente el número de filas o columnas que abarcarán.

• Column Span: El número de columnas que abarcará el cuadro seleccionado.
• Row Span: El número de filas que abarcará el cuadro seleccionado.
• Reset Grid Children: Restablece todo lo establecido anteriormente.