How to maintain margins when text elements change size

Question:
I am trying to maintain gaps between boxes or containers.
Here is what it looks like in Wix editor.

Here is what it looks like by the time I publish:

Note that the boxes’ size change due to the amount of content. In my case, the boxes’ size shrank, thus expanding the gap between boxes.

I have tried adding another container to contain the boxes.
I have tried creating boxes inserting them between content boxes, not sure if I properly made contact as I noticed the pink line snap for one box but not the other.

According to the article
" Velo: How Page Layout Is Affected When Elements Change Size"

I believe I have satisfied the above by inserting a box in between the content boxes, yet doesn’t adjust to the amount of content displayed. I am confused as to what I have missed

Product:
Using Wix editor

Update:

I think it works but not by creating a box and simply insert the box to join between two content boxes.

Here is the end result in published form:

The snapping join pink line animation can work multiple sides but I think to be safe, I found that if I order the snapping join animation, that ensures that the boxes are in contact with each other. Whereas before I assumed that if one side was showing the join pink line animation, it would automatically join the other.
e.g.
First order contact

Second order contacting