Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #1485961

    Hello,
    I am struggling with the horizontal image gallery. I would like to show some text below each image and I am using “image copyright”, because I found no other possibility. The problem is, that it should show up below the image, and not on it. To get this working I used the following code:
    .presse-galerie .av-image-copyright {
    position: relative;
    padding-top: 10px;
    }
    Where .presse-galerie is my class for the gallery.
    This works for desktop view. But unfortunately not in tablet or mobile mode. My copyright text will displayed on the image and is not readable.

    Another issue is, that the horizontal gallery is not really responsive. It only works well in desktop mode. But on smaller screens images are badly cropped. Could you please provide some CSS to make this elements responsive?

    Thanks, Bettina

    #1486005

    Hey Bpelzer,

    Thank you for the inquiry.

    Adding this css code should help move the copyright text below the image, but it will create a bit of extra space below the slider.

    #presse .av-horizontal-gallery {
        padding-bottom: 120px;
    }
    
    #presse .presse-galerie .av-image-copyright {
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        position: absolute;
        padding-top: 0;
    }
    
    #presse .presse-galerie .av-horizontal-gallery-wrap {
        overflow: visible;
        padding-bottom: 50px;
    }

    View post on imgur.com

    Best regards,
    Ismael

    #1486015

    Thanks, Ismael.
    That CSS solves my problem with image copyright. Great!
    What about the responsiveness?
    When looking at the gallery in tablet or mobile view, then all images are cropped. I need them to show in full size, without croppting.

    And I need the gallery to show 4 images in one row. There is no setting for that. How can I solve this?

    Best regards
    Bettina

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