Помогите создать таблицу на дивах

Dimoogle
На сайте с 08.01.2007
Offline
100
931

Всем привет. Подскажите пожалуйста как создать таблицу на дивах состоящую из 3х колонок. Если быть точнее нужна не совсем таблица, а нужно разместить в центрально части страницы текст в 3 колонки. То есть, чтобы все было аккуратно и красиво, каждый фрагмент отсортирован по центру, чтобы колонки не слипались друг с другом а были разделены по 33% шириной. То есть первая колонка ровно треть области, вторая и третья по 33% и текст в них отцентрован. У меня получилось создать 3 колонки, но текст лёг очень неаккуратно, то есть получилось, что все прилипло к левой части контента. а нужно чтобы было равномерно. Спасибо.

---------- Добавлено 26.12.2015 в 10:48 ----------

Вот как то так, чтобы было https://yadi.sk/i/GlzdAEMtmVqkF

L
На сайте с 16.10.2014
Offline
108
#1

учите CSS !!! юзайте гугл , все эти вопросы по 100 раз уже обмусолины


<div style="float:left; text-align:center; width:33%;"> бла бла блабла бла блабла бла блабла бла блабла бла блабла бла блабла бла блабла бла блабла бла бла </div>
<div style="float:left; text-align:center; width:33%;">бла бла блабла бла блабла бла блабла бла блабла бла блабла бла блабла бла блабла бла блабла бла бла </div>
<div style="float:left; text-align:center; width:33%;">бла бла блабла бла блабла бла блабла бла блабла бла блабла бла блабла бла блабла бла блабла бла блабла бла бла </div>



---------- Добавлено 26.12.2015 в 11:57 ----------

ту даже padding , margin и тд
Купить автомобиль из США можно тут (https://us-car.com.ua)
eis
На сайте с 18.10.2008
Offline
473
eis
#2

Dimoogle, используйте padding и выравнивание текста в блокахдля хорошего отображения ☝

- Здесь я покупаю вечные ссылки на свои сайты! (https://backlinkator.com) - сотни ссылок за копейки
Dimoogle
На сайте с 08.01.2007
Offline
100
#3

Спасибо. Буду пробовать.

M
На сайте с 20.08.2004
Offline
376
#4

попробуйте просто вот так применить класс к своему диву

.col3 {

width: 100%; /*указываем общую ширину блока с колонками*/

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

column-count: 3; /*количество колонок, на которое хотим разбить текст*/

-moz-column-count: 3; /*для мозилы*/

-webkit-column-count: 3; /*для webkit браузеров*/

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

-moz-column-gap: 40px;

-webkit-column-gap: 40px

}

<div class=col3>

<li>1</li>

<li>1</li>

<li>1</li>

<li>1</li>

<li>1</li>

<li>1</li>

<li>1</li>

<li>1</li>

<li>1</li>

<li>1</li>

</div>

вместо li, можете использовать любой тег, или просто стилизируйте li под ваши нужды

отец сыночка, лапочки дочки и еще одного сыночка
L
На сайте с 10.02.2015
Offline
261
#5
Miracle:
<div class=col3>
<li>1</li>
</div>

Это уже какой-то бред.

<li> должен быть в вложенным в <ul>

M
На сайте с 20.08.2004
Offline
376
#6

<ul class=col3>

<li>1</li>

</ul>

<div class=col3>

<p>1</p>

</div>

и тд

вариантов море

включите мозги

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий