How to stack blocks in tablet view like mobile view

Hi! How can I stack the elements (text block + image) in tablet view like in the mobile view? 

Password: Illusterre2022

Thanks in advance!

Can you share your website URL?

6 hours ago, Ziggy said:

Can you share your website URL?

https://illusterre-sample.squarespace.com/ password: Illusterre2022

Sorry, i thought i put it somewhere already! 🙂 I actually need the same solution for other sections on my website for the tablet version (see pictures). Is there maybe some sort of code i can apply to different sections? Thank you in advance!

This is a bit of a new one for me, Fluid engine requires a different way of doing this, can you add this to your Custom CSS and let me know how this looks on tablet screens (i.e. between 999px and 768px):

@media screen (min-width:768px) and (max-width:999px) {
  .fe-block-ac891789c5e3492edea1 {
    grid-area: 1/2/12/26 !important;
  } 
  .fe-block-yui_3_17_2_1_1668550060589_15027 {
      grid-area: 13/2/18/26 !important;
  }
}

Let me know how this goes!

8 hours ago, Ziggy said:

This is a bit of a new one for me, Fluid engine requires a different way of doing this, can you add this to your Custom CSS and let me know how this looks on tablet screens (i.e. between 999px and 768px):

@media screen (min-width:768px) and (max-width:999px) {
  .fe-block-ac891789c5e3492edea1 {
    grid-area: 1/2/12/26 !important;
  } 
  .fe-block-yui_3_17_2_1_1668550060589_15027 {
      grid-area: 13/2/18/26 !important;
  }
}

Let me know how this goes!

Hi! thank you so much for your effort! unfortunately I did not see any difference yet.

I have to run a few tests myself, I'll try and get back to you soon.

On 12/8/2022 at 11:41 AM, Illusterre said:

Hi! thank you so much for your effort! unfortunately I did not see any difference yet.

Try updating the formatting of your "grid-area" settings as follows:

    grid-area: ~"1/2/12/26";

So the full code would be:

@media screen (min-width:768px) and (max-width:999px) {
  .fe-block-ac891789c5e3492edea1 {
    grid-area: ~"1/2/12/26";
  } 
  .fe-block-yui_3_17_2_1_1668550060589_15027 {
      grid-area: ~"13/2/18/26";
  }
}

Let us know if that works!