Tagged: , , , ,

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

    Hello there,
    I would like to know how to customize the style applied to Masonry images and titles. Namely:

    a) The images being shown are cropped or hidden by the title bar. Is there any way to change proportions/resize them to allow viewing 100% of the original photo?
    b) How can I reduce the padding of the title being shown below each image?
    c) How can I change the font size and line height of the text being shown on mouseover?

    Thanks for your help!


    OK, I have partially solved issue a) and b) using the following CSS code:

    .av-masonry-image-container {
    background-size: contain!important;
    background-position: inherit!important;
    .av-masonry-entry .av-inner-masonry-content {
    padding: 10px!important;

    However, when I enlarge the page and the image+title boxes resize themselves, an unwanted portion of the images is being shown above the title (see enclosed screenshot)

    Any help to fix these issues would be most appreciated!



    this does not happen for me. When exactly do you see this? Maybe you need to add some media queries for larger screens to your code: https://css-tricks.com/snippets/css/media-queries-for-standard-devices/

    Best regards,

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

You must be logged in to reply to this topic.