Issues: Display blocks in mobile view + add new content only for some devices (not all)

[laproductora]

Hi all!
I’m having some trouble adapting the devices, heights & layout displays.

Issue 1)
The 2 blocks have to be displayed one on top the other but without the scrolling down inside the block. I understand this is happening because of the overflowing option, but I don’t get how to the set this up in a normal way. Which are the best settings? In this way, the footer is also not visible (I understand id because the height 100%, is that right?).

Issue 2)
Is it possible to add a new div block in the Mobile view (visible) and to be hidden in desktop? Every time I add new content for mobile version (blocks or other elements), this content is visible the other views. If I hide the element, then it gets hidden from all the devices. I need this content to be hidden for desktop and visible for mobile.

Here is my ready-only link:

Webflow - L'Eixida web

Can someone help me with this, please?
Thanks in advance!

N.

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

[Stan]

Hi @laproductora I have ben checking your code and there are some CSS settings that should be dane to make your site to work as you wish. One thing that I have found is that collection list wrapper in block 65 has position absolute that cause overflow because as you probably know when element is in absolute position is removed from standard flow.

You can start there to fix some odd behaviour. I can see that you have set grid (block 65), when you need stack elements in standard flow (top-bottom) there is several ways to do that. You can set on mobile device grid to col1fr/auto ( that remind me that you have several manually set auto rows).
Please check this post to understand what I mean. You can wrap elements in block etc. There is a more issues that can be fixed.

You can show element only on certain devices in this section

you can get more informations in Webflow university in section hide elements

Hope this will give you some idea where to look and what to improve or change.

[laproductora]

Hey Stan,
First of all thanks for trying to helping me!

I’m not sure I get what you mean.

I understand that if the block 65 is in absolute position doesn’t follow the standard flow, but if I put relative or static, the content doesn’t fit inside the grid as I want.

I suppose his is causing the non responsive behaviour, but, which are the correct settings in this case? also it happens with block 66 and 67. How should I do responsive the content inside this blocks? if the inner blocks are not in absolute position?

Thanks!

[Stan]

Hi @laproductora I’m sorry but I will have time to look on it again probably at Monday as I’m under tight deadline with lots things to do. But, If will have chance to look on it earlier (to get some rest ) I will surly do.

[laproductora]

Hi @Stan,
I think I fixed a bit the structure but I’ll need some advice with the heights.
Is there any way to add an auto height to the blocks in order to get adapted depending on the text length?
Here, because I added a vh height, the space between the text and the block is changing depending on the text length. Because this website is for a client, I need that they didn’t change the design, but only the text, and the block get adapted according to the text.
Can you help me with that?

Thanks a lot!!

Webflow - L'Eixida web