Можете ли вы создать этот элемент в электронном письме с помощью html / css?

Question

Элементом, на который я ссылаюсь, является поле смещения , которое расположено выше, слева и ниже основного поля .

Теперь создать это с обычными HTML и CSS очень просто, используя абсолютное позиционирование и z-индекс.

Однако в электронной почте HTML, где вы в основном ограничены таблицами Я не могу понять это. Абсолютное позиционирование не представляется возможным. Большинство почтовых клиентов удаляют это. Я даже не уверен, разрешено ли отрицательное позиционирование.

Как бы вы это создали? Это возможно / стоит даже попробовать?

Answer 1

Для электронной почты вы бы не использовали две «карточки» и накладывали их, как в веб-разработке. Вы можете легко создать это с помощью таблиц и ячеек таблицы. Смотрите мою ручку здесь - codepen.io/Digital_Frankenstein/pen/GRJYOqd - Digital_Frankenstein

@ digital_Frankenstein предлагает отличное решение.