Как поставить картинку поверх других без использования Positioning, Divs или Backgrounds?

Question

Я использую html для кампании по электронной почте, и у меня есть проблема, у меня есть следующий код:

 <TABLE width="550px" height="723px" BACKGROUND="FlyerImage.jpg" border="0" cellpadding="0" cellspacing="0">
 <TR> 
    <TD style="padding-top:190px; padding-right:30px; line-height:0px;" align="right"> 
        <a style="line-height:0px;" href="http://LINK.com/"> 
            <img src="ViewOffer.png">
        </a> 
    </TD>
 </TR>

 <TR> 
    <TD style="padding-bottom:185px; padding-left:35px; line-height:0px;" align="left"> 
        <a style="line-height:0px;" href="http://LINK.com/"> 
            <img src="ViewMore.png">
        </a> 
    </TD>
 </TR>

</TABLE>

Этот код отлично работает на Gmail, Hotmail, Yahoo и некоторых почтовых клиентах, но вOUTLOOK он не отображается правильно, я уверен, что это потому, что Outlook не поддерживает фоновые изображения в таблицах.

Я использую веб-клиент Email Campaign, и рекомендации размечаются с использованием встроенного CSS, а неиспользуя теги html, head и body, не используя div и не используя позиционирование (абсолютное, относительное, фиксированное ...) и разметку таблицами.

Как мне расположить две кнопки призыва к действиюповерх основного изображения в определенных местах без использования этих техник?

Заранее спасибо =]!

Answer 1

Если CSS не поддерживается, то нет способа гарантировать расположение кнопок в верхней части изображения.В этом случае я бы рекомендовал перейти на карту изображений .Это чистый HTML без CSS, хотя я действительно не знаю, поддерживается ли он всеми почтовыми клиентами.

Вы бы включили изображение кнопки в основное изображение, а затем задали свои координаты (я незнать их, они представлены "?" ниже).Что-то вроде:

<img src="FlyerImage.jpg" alt="alternative text" usemap="#flyer" />
<map name="flyer">
  <area shape="rect" coords="?,?,?,?" href="http://LINK.com/" /> <!--button 1-->
  <area shape="rect" coords="?,?,?,?" href="http://LINK.com/" /> <!--button 2-->
</map>

Answer 2

Я никогда не пробовал, но похоже, что есть хакерский способ заставить Outlook поддерживать фоновые изображения. Link .

Answer 3

Ни фоновые изображения, ни расположение не очень хорошо поддерживаются в электронной почте HTML. Вот отличная ссылка: http://www.campaignmonitor.com/css/