How can I create responsive columns in Elementor?
In Elementor you can control the width of each column for different screen sizes.
For instance if you need two columns to be displayed next to each other in Desktopsize and then in 1 column layout in Mobile, follow the steps below:
1. First, create a two-column section in Elementor. To learn how to create a section as well as adding columns to one, you can read this article.
2. Click on the column settings icon in upper-left corner of the column in your layout so that a new dashboard on the left will open with the column’s settings.
3. In the Layout tab and Column Width section, you can type the column width percentage for a specific device size. (Desktop by default)
4. Click on Desktop icon in the Column Width section and two more device sizes mode will appear where you can set a column width for each of them individually. For example you can set 100% width for Mobile mode and 50% for Desktop mode.
5. Repeat the above instructions for the other column and update your layout.
