Email template and float: left

I am currently learning to code email templates using HTML and CSS. The images are all placeholders. I am having a trouble with the .threecolumns div - when I set it to float:left, they get out of the .wrapper entirely and basically just float in the grey space. I’ve tried changing the width and the max-width, but nothing seems to help. I would have solved it with a flex, but AFAIK one cannot use those in an email template? I think?

Would you mind taking a look at it?

This is a long time out of my wheelhouse, but we’ll toss it out there…

.clear-float {
    float: clear;

You have to go back more than twenty years to find the reading on this. As I recall, we needed an outer container with class ‘clear-float’, and the floated containers inside that one. This will keep the floats from escaping their parent container. Also, be sure to give the floated object a width.

More I cannot say without creating a demonstration, but I do think this is reading that everyone should have under their belt. CSS has changed a lot, but it was just as much CSS then, as it is now. The float property has never changed its behavior.