подгонка изображения к таблице дублирования (MailChimp)

#javascript #html-email #mailchimp

#javascript #html-электронная почта #mailchimp

Вопрос:

Я хочу, чтобы мое изображение заполнило всю таблицу, но я не могу этого сделать, потому что, похоже, у меня есть ячейка и таблица дублирования. Можете ли вы помочь мне разобраться, что происходит с моим кодом? Это на MailChimp, но я закодировал сам, потому что мне нужна связываемая картинка и связываемая кнопка. Итак, я хочу, чтобы мое изображение покрывало всю таблицу, включая кнопку связаться с нами (я уже знаю, что это не по центру, но это еще один момент, с которым я смогу справиться в ближайшее время). Заранее спасибо за вашу помощь.

 <table border="0"cellspacing="0" cellpadding="0">
<td align="center" valign="middle" style="padding-top:0px; padding-right:0px; padding-bottom:0px; padding-left:0px;"> </td>
<div class="mcnImage">
<a href="https://www.immeractive.com" target="_blank"> <img src="https://www.immeractive.com/wp-content/uploads/Immeractive_MailChimp.jpg" alt="Visualization3D_immeractive" title="Immeractive_ContactUs" height="100%" width="100%" class="emailImage" style="display:block;"style="vertical-align: baseline;"/> </a>
<style type="text/css">
    @media only screen and (max-width: 480px){.emailImage{ height:auto !important; max-width:400px !important; width: 400px !important;};"vertical-align: baseline </style>
<table border="0" cellpadding="0" cellspacing="0" class="emailButton" style="border-radius:95px; background-color:#4bb5c6;">
  <tr>
    <td align="center" valign="middle" class="emailButtonContent" style="padding-top:15px; padding-right:15px; padding-bottom:15px; padding-left:15px;">
      <a href="mailto:info@immeractive.com?subject=Information e-mail" email="" me="" target="_blank" style="color:#FFFFFF; font-family:Open sans; font-size:15px; font-weight:Regular; text-decoration:none;">CONTACT US</a>
    </td>
  </tr>
</table>
</div>  

Ответ №1:

Существует несколько проблем:

  1. Первое <table> содержит <td> сразу.
    Вы должны поставить <tr> между <table> и <td> (а позже закрыть его с помощью </tr> ).
  2. У вас есть a <div> непосредственно в первом <table> , но это не разрешено; оно может быть только внутри <td> или не внутри таблицы. Возможно, вы случайно закрыли <td> предшествующий ему файл слишком рано или забыли добавить новый <td> .
  3. Содержимое <style> блока синтаксически неверно: есть две открывающие { фигурные скобки, но только одна закрывающая } скобка, которая также, похоже, была помещена слишком рано, потому что за ней следует странный текст.

Комментарии:

1. Спасибо за ваш совет 🙂 Я абсолютно не эксперт (студент, изучающий маркетинг и коммуникации), но я хочу дать шанс попробовать. Я исправляю то, что вы мне сказали, и на самом деле это лучше, но изображение не покрывает всю таблицу, что мне делать?

2. Лучше всего попробовать еще немного, сделать это как можно лучше, и если все еще необходимо, тогда опубликуйте новый вопрос, содержащий HTML, который у вас есть на данный момент. Также совет : используйте [Tidy] кнопку при создании фрагмента кода Stack Overflow, это переформатирует код перед его публикацией, при этом могут возникнуть проблемы, поскольку переформатированный код будет выглядеть «странно», если вы оставили определенные ошибки в своем HTML.