When I try to change an existing one column page to a three column page the html seems to corrupt

[BellyRash]

I have an existing page with preliminary text and graphics in a one column format. I am trying to change it to a three column page but, when I do, the format doesn't translate well. The first column header jumps to the second column and the second column text jumps to the first column. After I save the html on-page code, the site somehow adds extra code. I think I have the correct liquid code in place as well as the correct on-page html. I am showing the code and html I am using below to confirm that I am correct.

I do not want to create a new page. It would take a week to reconnect all the links.

The page is linked to many other critical pages on the site. If I create a new page with a new URL link, all the links will be broken, so I am trying to just change the column formats and keep the URL link.

Thank you in advance for any help.

On-page

<div class="one-third-column">
Insert the content for the first column here.
</div>
<div class="one-third-column">
Insert the content for the second column here.
</div>
<div class="one-third-column-last">
Insert the content for the third column here.
</div>
<br style="clear:both;" />

Liquid

.one-third-column {
width:32%;
margin-right:2%;
float:left;
}
.one-third-column-last {
width:32%;
margin-right:0;
float:right;
}

@media only screen and (max-width: 600px) {
.one-half-column-left, .one-half-column-right,
.one-third-column, .one-third-column-last {
float:none;
width:100%;
margin-right:0;
}
}

[LitExtension]

Hi @BellyRash,

Please send your site and if your site is password protected, please send me the password. I will check it.