You can refer to the following example to see how the section looks in a live site: http://x-template.weebly.com/home-3.html
Step 1: Drag & drop X element
Within Weebly Editor, click on Build tab, navigate to THIRD PARTY section then drag and drop two X elements into the right position of your building page.
The following steps (from Step 2 to Step 4) are applied for the upper X element. You can configure the lower X element in a similar way.
Step 2: Choose display mode
Click on a blank area of X and choose Fullwidth in a pop-up Settings box.
Step 3: Choose column structure
In the Setting box, click on Configure Layout Settings to show the Settings panel.
3.1. Click on LAYOUT.
3.2. Choose the 1/4 - 1/4 - 1/4 - 1/4 layout.
3.3. Click on SETTING.
3.4. Turn on Equalize Column Heights option to make sure you set equal height for all four columns.
3.5. Choose a background color.
Step 4: Customize each column
Corresponding to each column, click on each box to create your own custom settings that include: background; title and text color; border color, thickness, types; padding; effect; etc.
Column 1, 3 & 4
Click on Done button at the right top of the screen when you have finished with editing.