Иногда нам нужно вывести текст в 2 колонки, это делается для для читабельности, где можно в одной колонке написать плюсы на заданный материал, а во второй минусы. Или просто в несколько колонок смотрится намного смотрибельно, и безусловно оригинально, так как в основе мы всегда наблюдаем одну запись. Как все можно сделать при задействование стилей, то ниже приведен вариант, что можно разместить на любом сайте или блоге, любой тематики.
HTML
Код
<div class="nulosemadag">
<div class="vukavna-kolonka">
<b>Текст левой колонки</b>
<p>Описание 1</p>
<p>Описание 1.1</p>
</div>
<div class="vukavna-kolonka">
<b>Текст правой колонки</b>
<p>Описание 2.</p>
</div>
</div>
CSS
Код
body {
font-size:14px;
padding: 15px 20px;
}
.nulosemadag {
white-space: nowrap;
}
.vukavna-kolonka {
white-space: normal;
display: inline-block;
width: 48%;
vertical-align: top;
background: #fff2e1;
}
.nulosemadag .vukavna-kolonka:first-child {
margin-right: 4%;
}
Колонки идут на аналогичной высоте.
Демонстрация
