How to overlap/overlay an image from one row onto another?

In some cases, you want an image to overlap/overlay two rows within Visual Composer layout. Meaning, the image should be “placed” on two different backgrounds. To achieve it, follow these simple steps:

  1. Add two rows and set their properties (ex. define background colors via Design Options);
  2. Add Single Image element to the second row;
  3. Open Single Image Design Options;
  4. In Design Options, set a top margin with negative value (ex. -100).

Image overlay/overlap in Visual Composer

Note: It is possible to control margin values through various devices by selecting ‘Custom’ under ‘Device types’.