Блоки на одной линии, картинки и тексты

[freeliman]

Привет ребята. Подскажите как сделать так, чтобы разместить картинку а напротив неё текст.
Мне надо чтобы в мобильном варианте. Текст уходил под картинку.

Сейчас стоит Wordpress и всё это дело в таблице. В мобильном виде, картинка становится маленькой а текст большим и столбик узким.

Вот такая вот шняга. Парни. Нужно в общем картинку сделать над текстом и чтобы текст меньше становился в мобильной версии то.
Ну ладно фиг с ним с размером текста. Картинка тоже сойдёт.

 

В общем внизу 5 таких секций. Вот код кодыч

<table style="width: 100%;" border="0" cellspacing="0" cellpadding="0" align="left">
<tbody>
<tr>
<td style="width: 20%;"><a href="https://minelead.pro/%d0%b2%d0%be%d0%b7%d0%bc%d0%be%d0%b6%d0%bd%d0%be%d1%81%d1%82%d0%b8/%d0%b7%d0%b0%d1%8f%d0%b2%d0%ba%d0%b0/" rel="attachment wp-att-279"><img class="alignleft wp-image-279 " src="https://minelead.pro/wp-content/uploads/2018/09/Заявка.png" alt="" width="199" height="199" /></a></td>
<td style="text-align: left; vertical-align: middle;">
<div id="boxShadowhometext">
<div id="h3">
<h3 style="width: 100%; text-align: left;"><span style="zoom: 1; font-family: Arial, Helvetica, sans-serif; color: #abba15;"> 1.Этап - Вам нужно выбрать Услугу и Тариф,
нажав на вкладу "ЦЕНЫ" После чего "Оставить заявку" и дождаться обработки</span></h3>
</div>
</div></td>
</tr>
<tr>
<td style="text-align: left; vertical-align: middle;"><a href="https://minelead.pro/%d0%b2%d0%be%d0%b7%d0%bc%d0%be%d0%b6%d0%bd%d0%be%d1%81%d1%82%d0%b8/%d1%81%d0%b2%d1%8f%d0%b7%d1%8c/" rel="attachment wp-att-283"><img class="alignnone size-full wp-image-283" src="https://minelead.pro/wp-content/uploads/2018/09/Связь.png" alt="" width="200" height="200" /></a></td>
<td style="text-align: left; vertical-align: middle;">
<div id="boxShadowhometext">
<div id="h3">
<h3 style="text-align: left;"><span style="font-family: Arial, Helvetica, sans-serif; color: #d2b327;"> 2. Этап - После обработки заявки и изучения вашего бизнеса, с вами свяжется "Старший менеджер" для получения подробной информации и обсудит все детали</span></h3>
</div>
</div></td>
</tr>
<tr>
<td style="text-align: left; vertical-align: middle;"><a href="https://minelead.pro/%d0%b2%d0%be%d0%b7%d0%bc%d0%be%d0%b6%d0%bd%d0%be%d1%81%d1%82%d0%b8/%d0%b8%d0%b4%d0%b5%d1%8f/" rel="attachment wp-att-280"><img class="alignnone size-full wp-image-280" src="https://minelead.pro/wp-content/uploads/2018/09/Идея.png" alt="" width="200" height="200" /></a></td>
<td style="text-align: left; vertical-align: middle;">
<div id="boxShadowhometext">
<div id="h3">
<h3 style="text-align: left;"><span style="font-family: Arial, Helvetica, sans-serif; color: #df8a16;"> 3. Этап - Наша команда проведёт "Анализ рынка" составит "Коммерческое предложение" и соберёт "Целевую аудиторию" для вашего бизнеса</span></h3>
</div>
</div></td>
</tr>
<tr>
<td style="text-align: left; vertical-align: middle;"><a href="https://minelead.pro/%d0%b2%d0%be%d0%b7%d0%bc%d0%be%d0%b6%d0%bd%d0%be%d1%81%d1%82%d0%b8/%d1%80%d0%b0%d0%b1%d0%be%d1%82%d0%b0-2/" rel="attachment wp-att-285"><img class="alignnone size-full wp-image-285" src="https://minelead.pro/wp-content/uploads/2018/09/Работа-1.png" alt="" width="200" height="200" /></a></td>
<td style="text-align: left; vertical-align: middle;">
<div id="boxShadowhometext">
<div id="h3">
<h3 style="text-align: left;"><span style="font-family: Arial, Helvetica, sans-serif; color: #507b8e;">4. Этап - Мы проведём "Опрос" среди вашей "Целевой аудитории" соберём "Контакты" и сформируем детальный "Отчёт" о проделанной нами работе</span></h3>
</div>
</div></td>
</tr>
<tr>
<td style="text-align: left; vertical-align: middle;"><a href="https://minelead.pro/%d0%b2%d0%be%d0%b7%d0%bc%d0%be%d0%b6%d0%bd%d0%be%d1%81%d1%82%d0%b8/%d0%bf%d1%80%d0%be%d1%84%d0%b8%d1%82/" rel="attachment wp-att-281"><img class="alignnone size-full wp-image-281" src="https://minelead.pro/wp-content/uploads/2018/09/Профит.png" alt="" width="200" height="200" /></a></td>
<td style="text-align: left; vertical-align: middle;">
<div id="boxShadowhometext">
<div id="h3">
<h3 style="text-align: left;"><span style="font-family: Arial, Helvetica, sans-serif; color: #c7452d;">5. Этап - Вы получаете "Cвежую базу" потенциальных клиентов, прямо во время нашей работы.
Вам остаётся связываться с клиентами и принимать заказы ! </span></h3>
</div>
</div></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</tbody>
</table>

 

 

[npofopr]

Переделай код кодыч свой в блочный, станет проще. 
И избавься от дублирования ID. 

[freeliman]

А как это сделать ? Можешь помочь?