Portfolio Image Layout like be/marketing ?

tableconnect · February 2016

Hello,

could you please explain how you accomplished the image/portfolio layout on this page (below key advantages section)

http://themes.muffingroup.com/be/marketing/

Also the far right image has the same aspect ratio as the other images when opend in the lightbox but is displayed in "portraitmode" within the section.
How did you achieve that arrangement + masked the right image to different aspect ratio?

Thanks

Albert · March 2016

Hi,

this is Portfolio item with Masonry Flat style. That's all we used here.

tableconnect · March 2016

I already tried your suggestion - please have a look at this image to better understand the problem:
https://www.dropbox.com/s/ifsk34urych3680/portfolio_layout.jpg?dl=0

When using masonry flat with 3 columns, I still get 4 columns and all images have the same original aspect ratio instead of coming together like in your example...

Thanks

Albert · March 2016

You should check single Portfolio items. We bet you did not set different ITEM SIZE for portfolio items.

tableconnect · March 2016

Thanks - that did the trick. (really hard to find out by yourself actually)

Unfortunately the masonry layout breaks once you scale your browser wider than 1920px, but that also happens in your demo, so I guess we got to live with that...

Albert · March 2016

Yes, you need to live with that. It's because the images are cut especially to screen size. There is no way to create universal size that would work on every screen size perfectly.

tableconnect · March 2016

Alright, thank you.
Although to be honest I cant see the logic why everything scales correctly/as expected with any arbitrary windowsize below a width of 1920px but not with any width above 1920px....

With screens and resolutions increasing year by year you might want to start making BeTheme play nice with resolutions above 1920px.
Besides that and the poor lightbox experience I´m a fan of Muffinbuilder - keep it up!

Albert · March 2016

This is what we usually do but not in this case. Some features are just limited and there is nothing what we can do to jump them over. If you think it's possible then maybe you can enlighten us and tell how this can be done in your opinion? Because we are sure that in this case (we mean this layout), it's just not possible because if we will prepare it for larger screens, it won't look good on smaller.

Portfolio Image Layout like be/marketing ?

Comments