Float property doesn't work as intended

I was trying how float will work if we can’t use flex box for any given reason.
I want my col-1-of-2 to float left and another col-1-of-2 to float right ( Both side by side like a flexbox). But it does not work.

You can see the pen above and help me


Okay i got your point and I tried and it does not work as intended.

Edit:2 Found the solution, i had to put space inorder to calc work properly