Elementor Not Stacking On Responsive, Tablet Layout

I am using Elementor with Sydney Pro. Both work well and seem to nicely compliment one another. My problem is this. I have added a TWO column element, with an image in the left side and text in the right side. On the Desktop view things look nice and aligned perfectly. On both the vertical and horizontal views on my iPhone the two items stack nicely with the image at the top and the text below it, which is exactly what I want with both the tablet and phone layouts.

Now, here is my problem. When I view it using my iPad, in both vertical and horizontal views, the image is to the left and text to the right, just like my desktop/laptop view and it looks awful. I need for these two items (image and text) to stack and show with image above text, like the iPhone is doing. I can’t get it to happen. What CSS do I need to add, to have this happen?

Thanks!

Hello there, ’

From your site’s dashboard, go to Elementor menu and choose Settings. Then set the device’s breakpoint settings to become like this:

57

If it doesn’t work for you, go to the section’s settings panel in your page and define a custom ID selector name. For example: my-row

11

Update page.

Then go to Appearance > Customize > Additional CSS from dashboard. And add this CSS code:

    @media only screen and (max-width: 1024px) {
      #my-row .elementor-row .elementor-column {
        width: 100% !important;
      }
    }

Regards,
Kharis

kharisblank

    December 30

Hello there, ’

From your site’s dashboard, go to Elementor menu and choose Settings. Then set the device’s breakpoint settings to become like this:

If it doesn’t work for you, go to the section’s settings panel in your page and define a custom ID selector name. For example: my-row

11

Update page.

Then go to Appearance > Customize > Additional CSS from dashboard. And add this CSS code:

    @media only screen and (max-width: 1024px) { #my-row .elementor-row .elementor-column { width: 100% !important; } }

Regards,

Kharis