Elementos superpuestos (margen negativo)

WebAcappella FUSION permite que los elementos se desborden verticalmente en relación con otros utilizando ciertas propiedades CSS.

Este efecto sólo aparecerá en las pruebas y en la publicación.

Después de unos cuantos intentos y de este tutorial, este principio se convertirá en algo natural y no dudarás en utilizarlo para dar más vida a tus páginas.

Desbordar una imagen en una caja

Aquí hay 2 cuadros con una imagen en el primer cuadro (rojo) y texto en el segundo (azul).

../../../_images/1_two_boxes.png

Primero dejo espacio en la segunda caja (azul) con el margen alto

../../../_images/top_inner_margin.png
../../../_images/2_two_boxes.png

Seleccione la imagen y aplique un margen negativo

../../../_images/apply_negative_margin.png

A continuación, vea el resultado en la prueba

../../../_images/result.png

Advertencia

La vista del margen negativo no se aplica en el editor, sino sólo en las pruebas y la publicación.

Truco

Los márgenes negativos en CSS se ajustan a las especificaciones oficiales de CSS y, por tanto, son válidos en todos los navegadores actuales.