Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • May 25, 2018 at 2:42 pm #962154
    daanokku

    Hi there,

    I have a question about the enfold theme. I’m trying to recreate something like this:

    View post on imgur.com

    So like, an big image overlapping a section and touching the right side of the screen. It doesn’t work out using the image module. Can someone explain me step by step how to do this?

    Here’s another example:

    View post on imgur.com

    The mobile phone goes ‘out-of-section’, which i would like to recreate.

    Thanks in advance.

    • This topic was modified 6 years, 11 months ago by daanokku. Reason: Added photo
    May 26, 2018 at 9:05 am #962529
    daanokku

    Bump

    May 28, 2018 at 12:43 pm #963130
    Ismael

    Hi,

    Thank you for using Enfold.

    Enable the custom css class field so that you can target a specific image element. The first design can be achieved by applying a negative margin to pull the image towards the right or left. For the second one, just increase the size of the image and set the position to absolute. Do you have a test site or page?

    // https://kriesi.at/documentation/enfold/intro-to-advanced-layout-builder/#turn-on-custom-css-class-field-for-all-alb-elements

    The “out-of-section” image:

    .custom-css-class-image {
    position: absolute;
    width: 200%;
    height: 200%;
    top: 50%
    left: 50%;
    transform: translate(-50%, -50%);
}

    Best regards,
    Ismael

    May 28, 2018 at 4:30 pm #963343
    daanokku

    Thanks for the reply. I added a temporary login in the private content section. Hope you can help me!

    May 30, 2018 at 1:59 pm #964242
    Victoria

    Hi lrsp,

    Best regards,
    Victoria

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.