I’m trying to get the masonry portfolio to display images at pixel width or a predefined width via CSS. The behavior here on the widest browser set is closest to what I’m going for.
http://enfold.banyancom.com/people/
Bascially I’d like to turn off the responsive 3 col, 2 col, and 1 col settings. How could I do that?
Hi hebchop!
Please add following code to Quick CSS in Enfold theme options under Styling tab and adjust as needed
.av-masonry-gallery .av-masonry-entry {
width: 10%!important;
}
Regards,
Yigit
Thanks! I did find this code in another thread, the “!important” did make it work for me.
I’d consider this resolved, but it raises another question for me. Would it be possible to assign different image sizes at different CSS breakpoints?
For example, when I hit 768px could I change width to : 20%?
Thanks for the help.
Hi!
Sure, you can add following code to Quick CSS to do so
@media only screen and (max-width: 768px) {
.av-masonry-gallery .av-masonry-entry {
width: 20%!important;
}}
Regards,
Yigit
worked great! thanks! finally getting a hang of media queries.