Tagged: , , ,

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • April 17, 2017 at 9:15 pm #778955
    1lizcollins

    Hi there,

    I’m trying to round the corners of all portfolio grids on my website, but so far no luck. Here’s the most recent attempt – any suggestions?

    .grid-image img {
    border-radius: 3px;
    }

    Thanks!

    April 17, 2017 at 9:42 pm #778962
    Jordan Shannon

    Hey 1lizcollins,

    You have to use a higher radius. I adjusted your code to the following:

    
.grid-image img {
border-radius: 22px!important;
}

    Please check to confirm and let me know if it is working.

    Best regards,
    Jordan Shannon

    December 23, 2021 at 10:54 pm #1333892
    beenee

    Hi all,

    this works fine.
    But how do you also round the edges from the hovered portfolio grid image?

    .grid-image img {
border-radius: 22px!important;
}
 a:hover .grid-image {
border-radius: 22px!important;
}

    this doesn’t work :-(

    Txs to y’all

    Stefan

    December 24, 2021 at 3:21 am #1333902
    Mike

    Hi,
    Typically the portfolio grid mouse-over is an overlay color, in which you would use this:

    .grid-image img {
border-radius: 22px!important;
}
.grid-image:hover .image-overlay {
border-radius: 22px!important;
}

    if this doesn’t help then please link to your example page so we can investigate.

    Best regards,
    Mike

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Rounded corners for images in Portfolio grid’ is closed to new replies.