Как сделать, чтобы блоки перемещались на маленьком экране?

Здравствуйте! Пожалуйста, помогите по такому вопросу:
У меня в основном блоке сайта (там, где собственно информация, статьи и т.п.) предполагается после заголовка картинка (слева) и небольшой анонс (справа от картинки), а после них текст.
НО: мне надо, чтобы четко картинка и анонс были вверху. Анонсы разного размера: где-то они чуть меньше картинки, где-то чуть больше. Но всё равно они должны быть как бы в две колонки: слева — картинка, справа — анонс. Даже если низ их не везде идет ровной линией.
А потом, после них, должен идти основной текст.

Я сделала это при помощи таблицы (table): таблица из одной строки и двух колонок, где в левой колонке я ставлю картинку, а в правой пишу анонс. А потом, ниже таблицы идет основной текст.

НО у меня проблема: при просмотре с маленького экрана правая колонка сужается вплоть до пары букв — читать ее таким образом не возможно. Мне надо, чтобы правая колонка в такой ситуации «перескакивала» после картинки, ниже нее.

Я понимаю, что, наверно, это делается при помощи div-ов. Но как их настроить таким образом, чтобы на большом экране они стояли рядом, а на маленьком — тот, что справа, перескакивал вниз?