Media queries and gmail.com/outlook. How to layout a letter adaptively?

Question

css

Hello!
A solution is proposed in the article on Habré:
habrahabr.ru/post/258317
But it will not work in outlook and gmail.com, because they don't have support for media queries.
The thing is, I have a 2-column layout that should line up in one column on mobile phones.
Found a solution without media queries:
webdesign.tutsplus.com/ru/tutorials/creating-a-fut...
There, in paragraph 6, it’s just my case, but the problem is that with a viewport of less than 600 pixels, these columns line up in one, but at the same time their width is rather scanty - 300 pixels, and now phones are 350-450 pixels wide + in In my layout, the header and footer stretch to full width and everything looks very shabby. Ideally, these columns should also become the full width of the device along with the header and footer, and not 300px as suggested in the solution, and I don’t understand how to do this.
How to be?

Answer 1

Letters are typed in tables. The rubber in them is made by setting the width in%.