Elementi sovrapposti (margine negativo)

WebAcappella FUSION permette agli elementi di debordare verticalmente rispetto agli altri utilizzando alcune proprietà CSS.

Questo effetto apparirà solo nei test e nella pubblicazione.

Dopo qualche prova e questo tutorial, questo principio diventerà naturale e non esiterai a usarlo per dare più vita alle tue pagine.

Sovrapporre un’immagine su una scatola

Ecco 2 caselle con un’immagine nella prima casella (rossa) e un testo nella seconda (blu).

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

Lascio prima lo spazio nella seconda casella (blu) con il margine alto

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

Selezionare l’immagine e applicare un margine **negativo

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

Poi vedere il risultato nel test

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

Avvertimento

La visualizzazione negativa dei margini non si applica nell’editor, ma solo nei test e nella pubblicazione.

Suggerimento

I margini negativi nei CSS sono conformi alle specifiche CSS ufficiali e quindi validi su tutti i browser attuali.