How to fix display for mobile (portrait)

Design help General
1

How to fix my site so that it stacks vertically on the mobile (portrait).

In webflow the parts causing the problems are called section 3.

I have 2 sections that are stacked on top of each other. Each section has 2 divs that are set to 50%.

On the smallest mobile display it looks to scrunched up so I want to make each div 100% and for them to stack vertically.

Currently
//Section 3
////////////////////////////////////////////////////////
// Div 1 (50%) // Div 2 (50%)
///////////////////////////////////////////////////////

Want it to be
//Section 3
////////////////////////////////////////////////////////
// Div 1 (100%)
////////////////////////////////////////////////////////
// Div 2 (100%)
///////////////////////////////////////////////////////

I have spent nearly 2 hours trying to get it to render properly and for what I am trying to it shouldn’t be this hard.

Any help would be truly appreciated.

Here is my site Read-Only: LINK

2

So I gess your “currently” mobile state is equal to your desktop state: two elements side by side.

And you want them to stack up on mobile.

3 ways to do that with Webflow.

  1. use the Column Component from the Add+ menu.
    Set it up for 2 colums.
    Then in the Settings panel, set the display options for what happens with the columns on devices.
    By default, columns stack on mobile.

http://vincent.polenordstudio.fr/snap/tarlg.jpg

  1. use Flexbox
    Here’s 2 example of divs set with flexbox. All the column divs are set to width 100%.

http://vincent.polenordstudio.fr/snap/qu61a.jpg

http://vincent.polenordstudio.fr/snap/q2a29.jpg

  1. using just CSS
    Change the %width of the div for mobile… pass it to 100% when you’re on the mobile view and to 50 when on desktop
3

Thanks for your reply,

But actually I am not using columns, just using two divs as inline-blocks with width at 50%.

I have changed the setting to 100% on the mobile portrait but it is just really messed up in terms of displaying the background images.

It’s hard to explain without looking at it.

please check my read only link to see what I mean.

Thanks once again

4

All Sorted

I was having a dumb moment.

It’s all sorted

5

My animated transition is not working on mobile portrait mode can you plz help me out.