When creating a page or template with Elementor, you sometimes want some widgets to have a side-by-side position in the same column. Elementor supports inline positioning that allows you to accomplish it. To give an overview, here is what we are talking about.
As you can see from the image above, there are two button widgets in the horizontal alignment in the same column. In Elementor, when adding a new widget to a certain column, you can only place it beneath or above an existing widget, in a vertical alignment. The custom positioning feature of Elementor allows you to have two or more widgets in a side-by-side position in the same column as the one in the image above.
First off, select a widget you want to set the custom position of and go to the Advanced tab. Open the Positioning block and set the Width to Inline (auto).
Select another widget in the same column and repeat the steps above.
That’s it.
The practice above is great to be implemented on a page where you offer a digital product, say a WordPress theme. You can provide two buttons (i.e. Buy and Preview) that your visitors to choose from.
In case you are new to Elementor, you can read the beginners’ guide we have written to learn how to use Elementor.
3 thoughts on “How to Use Inline Positioning in Elementor”
Hi, thanks for this tutorial. I tried to do this with the image and text widget but nothing changes. Is this technique limited to certain widgets only?
Cheers
The positioning tab no longer exist, any idea about how to do now ?
Hi Herve. On the new version of Elementor, you can find the inline setting on the Width option under the Layout block under the Advanced tab. You can also find the Position option here. Check out this screenshot