Grid not responding the viewpoint

[philysgdy]

Hi guys
can you have a look at this for me? I am building a chart using the grid. when I change the columns in XS and SM viewports the Grid will not accommodate my requiremnets.
https://vimeo.com/1182323782?share=copy&fl=sv&fe=ci

[ruenel]

Hello @philysgdy,

Thanks for writing in! I wonder on which page I can find this Chart using the Grid. I open most of the pages you currently have and I do not see a Chart.

Regards.

[philysgdy]

Sorry Rue
https://www.diamondfinishes.com.au/wp/wordpress/microcement-3/continuous-stone/

[christian]

Hey Phil,

Your current setup is tricky to resolve. For example, your Image and text are spread apart by cells that are very far from each other in relation to the normal document flow. The Grid element excels at positioning elements

Your current setup can’t easily be fixed. It’s strongly recommend that you use the Row element and use the Columns to contain the Text and Image elements. The structure would look like this:

Row
  Column
    Image
    Text
  Column
    Image
    Text
  Column
    Image
    Text
  Column
    Image
    Text

Set the Row to 3 column layout then 50 or 100% on mobile. The columns will naturally flow that way.

[philysgdy]

Thanks Christian
I will adopt your approach. And report back.

[philysgdy]

Christian
All done. much easier! Thanks for your direction. And of course I have another question. A lightbox for each of these. What do you recommend?

[ruenel]

Hello Phil,

You can use the Modal element.

You can then set the HTML tag of the column to use <a> so that you can click on the column to launch the Modal.

I created a demo in the very first column.

Thanks.

[philysgdy]

Thanks Rue
Got it. Thank you and the team for your support.

[ruenel]

As always, we are glad to help you out, Phil.