What is the easiest way to make a responsive email in html?

Question

Regular Expressions

What is the easiest way to make a responsive email in html?
Set table width as a percentage?

<table cellpadding="0" cellspacing="0" border="0" width="600" height="200"
       style="margin: 20px auto; padding:0; width:98%; max-width: 600px !important; min-width: 600px;
 class="mob-gmail-fix">

Answer 1

$pattern = '#<div class="class-1">(.*)</div>$#Uis'
The dollar at the end will say that your closing div is the last element
. But, in general, for HTML parsing, it's better to use ready-made libraries that have LIKE jQuery syntax. https://github.com/search?l=PHP&q=HTML+Parser&type...

Answer 2

In general, parsing HTML is a bad idea, but if you need to parse a small piece, then you can.
I use the service to write regular expressions:
https://regex101.com/
And if you need something more than a regular expression, then:
php.net/manual/ru/domdocument.loadhtml.php

Answer 3

Is it a mailing list or a table? :)
If it's a table, then you have mixed up the logic in css a bit, you need to do this:
width: 600px; max-width: 98%
In general, in order for your mailing list to be more effective, it is enough to simply analyze the factors under which advertising letters are immediately deleted, based on your own experience. Here you are often in NORMAL correspondence with a friend / partner / etc. directly in the text of the letter of the table you draw? Do you highlight something with a color or font size?
That's it)

Answer 4

The easiest way to use the framework, I use https://foundation.zurb.com/emails.html
Very captivating resemblance to bootstrap, all classes are ultra logical.
Read carefully, collect a regular letter with classes, drive it into the inliner and send it to the mailing list.

Answer 5

Probably the easiest way is to use the built-in mailing service editors or special services, where there are ready-made templates that will immediately adapt to different devices.
If you type up a letter in code, then you need to use media queries and prescribe in them how the letter will look on screens with different extensions. With their help, you can change the font size and color of buttons, placement, width of blocks and pictures depending on the screen size.
For example, to reduce the size of the displayed text for a screen of 600px, you must specify:

@media (max-width:600px) {
  body { font-size: 16px; }
}