Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • June 12, 2014 at 6:49 pm #278174
    connect4consulting

    Hi,

    I have 8 photos that I’d like to use in a full width masonry gallery and I’d like them to take up only one row and automatically re-size depending on the screen size.

    Here’s the site – http://konishki.connect4consulting.com/

    Thanks,
    Gabe

    June 12, 2014 at 7:08 pm #278191
    Josue

    Hey Gabe!

    Try adding this code to the Quick CSS:

    .home .av-masonry-entry {
    -webkit-transform: none !important;
    width: 100% !important;
    position: static !important;
}
.home .av-masonry-container {
    height: auto !important;
}

    Cheers! 
    Josue

    June 12, 2014 at 7:43 pm #278224
    connect4consulting

    Josue – thanks for your help but…

    That didn’t work at all! Check out the page – http://konishki.connect4consulting.com/

    What I’m trying to do is use the masonry look but just have 8 images in a row horizontally and have them resize depending on screen size. I also would like to reduce the overall size of each image.

    Thanks,
    Gabe

    June 12, 2014 at 8:11 pm #278234
    Josue

    Ok, discard my previous suggestion.

    What you need to do is reduce the image size, that way 8 images can fit in a single row, try adding this to the Quick CSS:

     .responsive.html_stretched .av-masonry-entry{width:12.5% !important; }

    Regards,
    Josue

    June 12, 2014 at 8:36 pm #278252
    connect4consulting

    Josue,

    Okay – that’s much better.

    Now suppose I want to limit the mobile or tablet size so that it doesn’t reduce too small?

    June 12, 2014 at 9:08 pm #278267
    Josue

    Wrap the code into a media query, like:

    @media only screen and (min-width: 767px) {
 .responsive.html_stretched .av-masonry-entry{width:12.5% !important; }
}

    That way it will only affect it when the window is 767px wide or more.

    Regards,
    Josue

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