Как разделить сообщение блога на колонки

---

Разделить сообщение блога на колонки

Здравствуйте дорогие друзья, читатели и гости блога. Сегодня короткий пост, как нам разделить сообщение на две и больше колонки. Зачем, спросите Вы, но иногда бывает просто необходимо это сделать. Причин может быть несколько, и одна из них, как всегда обратить внимание к информации в своем блоге. Пример Вы уже видите, кого заинтересовало поехали, вот код

<style>

.text_code {

padding-bottom:20px; /*отступ снизу*/

width:100%;  /*указать ширину блока с колонками*/

text-align:justify;  /*выравнивание текста внутри колонок*/

column-width: 200px;  /*указать ширину колонок*/

-moz-column-width: 200px; /*указать ширину колонок*/

-webkit-column-width: 200px; /*указать ширину колонок*/

column-gap: 20px; /*отступ между колонками*/

-moz-column-gap: 20px;

-webkit-column-gap: 20px;

column-rule: 1px solid #ccc; /*разделить колонки линией если надо, и задать цвет разделителя*/

-moz-column-rule: 1px solid #ccc; /*разделить колонки линией если надо, и задать цвет разделителя*/

-webkit-column-rule: 1px solid #ccc; /*разделить колонки линией если надо, и задать цвет разделителя*/

}</style>

Я подробно в коде о настройках все расписала, думаю Вам будет понятно. Сообщение автоматически разделиться на колонки две-три в зависимости от настроек ширины страницы. Изучите внимательно, при вставке кода удалите информацию о настройках.

✓Этот код Вы можете вставить дизайн-добавить гаджет и сохранить внизу макета блога. ✓Можно при написании поста в редакторе сообщений перейти по вкладке HTML и вставить внизу поста. Далее, ту часть текста, которую хотите разделить на колонки, в редакторе сообщений, где Вы пишите свои посты, перейдите слева по вкладке HTML и заключите в этот код:

<div class="text_code">текст сообщения</div>

Если потребуется весь текст сообщения разделить на колонки, первую часть кода вставляете в режиме HTML в самом начале поста и в конце закрываете тэгом </div>.


✓Кто на Ты с шаблоном, можно вставить шаблон-изменить шаблон выше строки ]]></b:skin>, только удалите с кода <style></style>.

Кто использует много изображений в блоге, таким способом можно разделить картинки на две колонки, только придется подогнать размеры. Ориентируйтесь на ширину страницы и ширину изображения.

✓При просмотре черновика, до публикации, в отдельных шаблонах можете не увидеть разделение на колонки. Все появится после публикации.

✓Разделитель можно настроить на свое усмотрение: изменить форму, цвет, толщину. А я на этом закончу свою информацию. Буду благодарна за плюсик в социальных сетях, поделитесь со своими друзьями. Пишите отзывы, Всего Доброго!.

Почитайте по теме:  Как выделить виджеты блога разделителем; Кнопка Подписки Яндекса для чтения новых записей блога;

Рекомендуемый контент: