Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #1134999

    We have photos that are set to the circle styling in Enfold. There is a link on each photo and on safari, when hovering over the photo the grey overlay first highlights a square section and then the actual circled image. We have read through a couple of forums and believe there might be a css fix.

    #1136215

    Moderators, I am commenting to refresh the thread.

    #1136331

    Hi,

    Thank you for the update.

    Can you provide a screenshot of the issue? You can use imgur or dropbox for the screenshot.

    We might be able to contain the overlay inside the image link with this css code.

    .avia-image-overlay-wrap a.avia_image {
    	overflow: hidden;
    }

    Best regards,
    Ismael

    #1137272

    Hi, see private data for screenshot link. I tried your CSS, purged the cache a couple of times and tested again. My css was added to the staging site, but you can see the error on the live site.

    #1137784

    Hi,

    Thank you for the update.

    Did you toggle the Performance > File Compression settings after adding the code? The site is probably using the old merged stylesheet without that modification. Please post the login details in the private field so that we can test the site when necessary.

    Best regards,
    Ismael

    #1138111

    Hi! Yes, performance > file compression has been enabled. I gave you access to our staging ground. There is a password to access the front-end and then WordPress access for the backend. Please see the private area.

    #1138768

    Hi,

    Thank you for the update.

    We can’t get past the htaccess authentication using the account above. Please check it carefully.

    Best regards,
    Ismael

    #1144195
    This reply has been marked as private.
    #1144640

    .

    #1144895

    Hi,

    Thank you for the update.

    We added this code in the Quick CSS field.

    .avia_image .image-overlay {
        border-radius: 200px;
        width: 100% !important;
        height: 100% !important;
        transform: scale(1) !important;
    }
    

    Let us know if it helps.

    Best regards,
    Ismael

    #1148581

    Is Ismael,

    That CSS helped, but it doesn’t cover the circle fully. Each circle has a sliver of overlay not covering the photo on the right side.

    #1148928

    Hi leahmessina,

    Please use the code like this:

    
    .avia_image .image-overlay {
        border-radius: 200px;
        width: 100% !important;
        height: 100% !important;
        transform: scale(1) !important;
        left: 0 !important;
    }
    

    Best regards,
    Victoria

Viewing 12 posts - 1 through 12 (of 12 total)

You must be logged in to reply to this topic.