Как писать текст 2 и 3 колонки в статье на Blogger

Приветствую. Сегодня мне необходимо было разбить текст на несколько колонок. Но на Blogger эта функция не предусмотрена и мне пришлось спасаться при помощи тегов html

Способы писать текст  2 и 3 колонки в статье на Blogger

Есть два способа разделить текст в статье на Blogger с помощью тегов

1. при помощи тега <div>
2. при помощи тега <table>

В первом случае у нас будет просто текст с необходимыми колонками, во втором - будет присутствовать черта как в таблице ячейка.

Как писать текст  2 и 3 колонки в статье на Blogger

Сейчас используем первый способ написания двух колонок при помощи тега <div>

Пишем текст 2 и 3 колонки на Blogger с помощью тега <div>

Для того, чтоб разделить текст на две колонки, переходим в редактор html и вставляем в необходимое место код

<div style="float: left; width: 49%;">Текст левой колонки</div><div style="float: right; width: 49%;">Текст правой колонки</div><div class="clear">

 То, что выделено цветным, вставляете свои данные. Таким образом можно поделить на 3,4,5 колонок. Но обязательно нужно прописывать процентное соотношение колонок.

Мне теперь не до игрушек -
Я учусь по букварю,
Соберу свои игрушки
И Сереже подарю.

Деревянную посуду
Я пока дарить не буду.
Заяц нужен мне самой -
Ничего, что он хромой

Если необходимо перевести строку: используем тег <br> как в моем примере

Пишем текст 2 и 3 колонки на Blogger с помощью тега <table>

Как я уже писала выше, этот вариант будет больше похож на таблицу. Вернее это и будет таблица.

Используем следующий код для 2 колонки:

<table border=0 cellpadding=0 cellspacing=10><tr>
<td valign=top>1 колонка</td><td width=1 bgcolor=#000000><img src=1x1.gif width=1 height=1></td><td valign=top>2 колонка</td></tr>
</table>

Вот что у Вас получится

Как писать текст  2 и 3 колонки в статье на Blogger

Теперь меняем код и пишем без вертикальной черты на 3 колонки

<table cellspacing="10" cellpadding="0" width="100%" border="0"><tbody>
    <tr>
      <td valign="top" width="30%">1 колонка</td>
      <td valign="top" width="30%">2 колонка</td>
      <td valign="top" width="30%">3 колонка</td>
    </tr>
  </tbody></table>

Вот и результат - 3 колонки в статье на Blogger

А медведь измазан слишком... Куклу жалко отдавать: Он отдаст ее мальчишкам Или бросит под кровать.

Паровоз отдать Сереже? Он плохой, без колеса... И потом, мне нужно тоже Поиграть хоть полчаса!

Мне теперь не до игрушек - Я учусь по букварю... Но я, кажется, Сереже Ничего не подарю.

Нужно больше колонок? Добавляем в код и исправляем процентное соотношение колонок.
Например так:

<div style="float: left; width: 100%">
  <div style="float: left; width: 25%">Текст 1</div>
  <div style="float: left; width: 25%">Текст 2</div>
  <div style="float: left; width: 25%">Текст 3 </div>
<div style="float: left; width: 25%">Текст 4 </div>
</div>
<div style="clear: both"></div>

Смысл понятно, пробуйте.
Как всегда ваша Nata Lee и мой канал в Телеграм