Superposer des éléments (marge négative)

WebAcappella FUSION permet de faire déborder verticalement des éléments par rapport à d’autres à l’aide de certaines propriétés CSS. Cet effet ne sera visible qu’en mode test et à la publication.

Après quelques essais et avec ce tutoriel, ce principe vous deviendra naturel et vous n’hésiterez pas à l’utiliser pour donner plus de vie à vos pages.

faire déborder une image sur une box

Voici deux box avec une image dans la première box (rouge) et du texte dans la deuxième (bleu).

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

Je laisse d’abord de la place dans la deuxième box (bleu) avec la marge haute.

Sélectionnez l’image et appliquez une marge négative.

Ensuite, voyez le résultat en test.

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

Avertissement

La visualisation des marges négatives ne s’applique pas dans l’éditeur, mais seulement en test et à la publication.

Astuce

Les marges négatives en CSS sont conformes aux spécifications officielles CSS et donc valides sur l’ensemble des navigateurs actuels.