Page Designer

Hoping someone can shed some light on using cell properties Merge, Insert and Split.
I selected a 2 column layout. I then set each column to 50% of the parent. I then split the top row as in the image to 20% of parent each column. I expected to see the layout close to how I had laid out in design view. Instead as seen in the rendered image the third element gets pushed to the second column. It looks as though a third column was created. So do I now have a 3 column design?
I'm trying to figure out how and why this happens, also how to do a custom layout.
1) Why does inserting a row and splitting rows on one side of a 2 column layout, affect what happens on the opposite side of the 2 column layout?
2) Why does horizonal splitting of a row above another row affect the row below? can I be prevented?
3) Is splitting a row on a 2 column design layout the same as changing the layout to a 3 column page?
Is there any detailed information on page layout that covers Merge Insert and Split to create a custom design. I spent sometime on the internet and YouTube and been at it for weeks could use some help on this. Much thanks in advance.