Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #814591

    Hi

    How do I put a border on an image within a column where there is text and a button etc under it? The link shows how it should look on a Desktop (but method doesn’t work on a mobile).

    Thanks
    Gerry

    #814609

    Hey Gerry,

    Hi! I checked your website on mobile, but I can see borders in your images. Can you tell us what phone you’re using so we can replicate the issue?

    Best regards,
    Sarah

    #815131

    Hi Sarah

    I had done a work around to create the border to show what I wanted to achieve. But I had to put the image in a text box and use html to create the border. The description underneath is in a separate column container to the image and when you view on a mobile the image and the caption and button are separate.

    I would like to add a border to the image only so that when it is in a column container with text box and button, only the image has the border and when viewed on a mobile the image (with border), text and button are all together.

    Thanks
    Gerry

    #815760

    Hi!

    If you would like the image, text, and button to be together when on mobile, the best way is to put them in the same column. Then, add this in Quick CSS to add the border to your image:

    .avia-image-container {border:10px solid white !important;}

    Note that this will affect all images in your website. If you only want to do this for specific images, please turn on the Custom CSS field for ALB elements by following this tutorial, then use this code in CSS instead:

    .white-border.avia-image-container  {border:10px solid white !important;}

    Please replace white-border with the custom class that you used.

    Can you try that and let us know how it goes?

    Best regards,
    Sarah

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