Register

What is the Slot Vertical Align and how can I use it to design my landing page ?

After you've begun defining your landing page's structure using the various Containers, you can also start adding Elements to each available slot, filling the structure with content. Each Container you use comes with its own fully customizable group of Container settings. One of the most practical options contained in the settings is the Vertical Align option available for each separate slot.

Let's see what it does:

1. Click on the Settings symbol, appearing on the right side of the Container when you place your mouse over it, to open the Container settings.
Landing_pages-Slot_vertical_align_1.png

Make sure that you chose a Container that has at least two slots in it - anything but a Full Width Container will serve as a good example. Adding a Text element and some quick content will make the effect of a Vertical Align change on a slot clearly discernible.

2. Scroll down and click on the Slot 1 option to expand the menu for the slot that you have filled with text.
Landing_pages-Slot_verticl_align_2.png

3. Scroll down the menu and click on the Vertical Align option to open the drop-down menu.
Landing_pages-Slot_vertical_align_3.png
 
You have the following options:

  • Top
    Aligns the content of the slot to the top of the slot.

  • Middle
    Aligns the content of the slot to the middle of the slot.

  • Bottom
    Aligns the content of the slot to the bottom of the slot.

4. Choose the Bottom option.
Landing_pages-Slot_vertical_align_4.png


The text you've added should move inside the slot according to the Vertical Align setting you chose.

Now that you're familiar with how the vertical alignment of each slot can be changed, make sure you take advantage of it to tweak your design and make it look just perfect!