


To add a row or column in the project you can either drag and drop it directly on the canvas or in the treeview, in the container of choice. Adding elements within a row will automatically set them next to each other.Īdding a column in the canvas or in another container will add a 200px wide container with a vertical distribution of elements. When adding a row to the canvas you will add a full-width container with a horizontal distribution of elements. Both of these containers are semantically HTML elements with the “display: flex ” property added by default. From here you can add two types of containers: rows and columns. In the Left panel of the editor you will find the Layout section. Let’s find out how containers work in TeleportHQ and how to properly add other elements like images, videos or buttons to these containers. Containers provide the structure to any web page.
