Register

The Padding and how you can use it to design my landing page

 

After you have defined your landing page's structure using the various Containers, you can also start adding Elements to each available slot, filling the structure with actual content. Each Container you use comes with its own fully customizable group of Container settings. One of the most useful options contained in the settings is the Padding option.

Let's see what it does:

1. Click on the Settings symbol, that appears when you place your mouse over the Container, to open the Container settings.padding_landing_page_1_new.png

Make sure that you have chosen a Container that has at least one type of Element in it. This way you will be able to clearly discern how changing the Padding option actually affects the look of your landing page design.

2. Click on the up/down arrows, located next to the Padding setting on the left side of your Landing Page Designer page, to set the Padding value. Alternatively, you can type in the exact Padding number of your choice in the available field.padding_landing_page_2.png

The value has a range from 0 up to 2000 pixels. Increasing the amount increases the left and right lining of the particular row and subsequently decreases the space available for the row's slots.

3. Clicking on the lock icon reveals a menu consisting of additional Padding options: namely, Padding TopPadding BottomPadding Left, and Padding Right.  Use the up/down arrows in each field to select the desired amount of padding at the TopBottomLeft, and Right of each row. As before, you may also choose to type the appropriate number directly into the area next to the arrows.padding_landing_page_3.png

It is easy to see that whatever you have added inside the slot or slots of the row changes in size when you change the Padding. However, if you find yourself still feeling unsure about what the padding itself is, you might want to temporarily change the Row Color option to something other than the default transparent option so that the padding stands out more.