cancel
Showing results for 
Search instead for 
Did you mean: 

Question on how to achieve a specific grid layout in Buildify extension?

Question on how to achieve a specific grid layout in Buildify extension?

Hello,

 

We are trying to achieve a particular "grid" type layout using the Buildify extension, but we're struggling with getting it to work just how we'd like.

 

Here's a screenshot of what we have currently:
https://www.dropbox.com/s/yffsv20u2vihnls/current-layout.png?dl=0

 

And then one where we've expanded the width of the container:
https://www.dropbox.com/s/igrvu28m28bpuoj/widened-layout.png?dl=0

 

You can see in the widened layout that the heights do not change, only the width. We've tried using a vh value on the parent container, but only one of the containers grow:
https://www.dropbox.com/s/7dvkaagbevejer4/widened-with-100vh.png?dl=0

 

We also tried building it a bit differently, using inline images vs background images, but then we can't get the backend to look like the frontend (when we have content over the top of the image etc). And we need this to be easily manageable for the client, so when they build in the admin they'll know how it's going to look on the frontend.

 

Here's a video showing an example of how we would like the images/containers to respond according to screen size: https://www.awesomescreenshot.com/video/5010689?key=741f444a2af55658e20c80b8788dfaf5

 

We've also been able to do this using plain html and css using grid, grid templates, and stretch etc. But we're fighting against the html structure that Buildify generates.

 

Any help is much appreciated!!