Что лучше: <div> или <table>?

<div>
60
Нейтральная
сторона
14
<table>
17
Блочная вёрстка
Прежде чем писать комментарии или выбрать сторону вы должны авторизироваться!
Табличная вёрстка

16-04-2009 21:31 +1

за блочной вёрсткой -- будущее

9 комментариев
sporschik 16-04-2009 21:36 0

pluton, Это еще почем? Тег table отменят? Поделитесь инфой.

pluton 16-04-2009 21:39 +3

sporschik, table нужно применять конкретно для таблиц и всё.
а вёрстку страницы делать div'ами.

jir 16-04-2009 21:39 0

pluton, а где бы почитать про то как верстать дивами кто скажет?

aulizko 16-04-2009 21:40 +2

sporschik, Потому что будущее за семантикой.

Табличные данные представлять таблицей - семантично. Использовать таблицу для расоложения элементов на странице - не семантично.

ggdandelion 16-04-2009 21:40 0

pluton, помниться я в блокноте верстал без дивов и аблиц)) прям по живому теги писал))0 жесть канешно

civilguard 16-04-2009 21:41 0

pluton, В этом что-то есть, но время не пришло

pluton 16-04-2009 21:42 0

jir, неплохой курс тут: http://www.intuit.ru/department/internet/operawebst/
оригинал тут: http://dev.opera.com/articles/wsc/

jir 16-04-2009 21:58 0

pluton, благодарю

sporschik 16-04-2009 22:28 0

aulizko, И когда наступит это Ваше "светлое будующее"?

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

16-04-2009 21:44 +1

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

4 комментария
pluton 16-04-2009 21:47 0

nuxdie, но это не работает при загрузке XHTML-документа

vosmoi 16-04-2009 22:15 0

nuxdie, Это не правда, при загрузке есть только одно правило - отображать объекст когда загрузился закрывающий тэг этого объекта. Если у тебя таблица на весь сайт снизу до верха - то да, не отобразится до полной загрузки. Такая же беда может быть с и дивом. В общем, смотря как верстать.

sporschik 16-04-2009 22:30 0

nuxdie, Да щас уже браузеры отображают по мере загрузки, могут и пол ячейки показать (наблюдал не раз при плохом коннекте).

opera.rulez 11-07-2016 15:26 0

nuxdie, Существует свойство стиля table-layout: fixed, которое отменяет такое поведение таблиц.

Хотя всё зависит от браузера. При table-layout: fixed ширина таблицы по мере загрузки не пляшет, но и таблица теряет свою «резиновость».

17-04-2009 01:19 +6

div + css и делаем все, что душе угодно

1 комментарий
sporschik 22-04-2009 18:13 0

soulless, table + css и делаем все тоже самое.

17-04-2009 03:26 0

Всё же див, хотя 2 месяца назад предпочитал таблицы. Понял, что на див во-первых быстрее, во вторых проще раставить элементы как тебе нужно. Таблицы, останутсяу меня для таблиц, в этом их преймущество.

0 комментариев
17-04-2009 03:29 0

дивами удобней, хотя без таблиц порой не обойтись

1 комментарий
monly 27-04-2009 23:11 0

gcoda, Да здравствует блочная верстка и css стили (:

17-04-2009 10:32 +5

В отличии от таблиц, вёрстка слоями позволяет гибко управлять последовательностью контента в коде не зависимо от его размещения на странице.

В частности, сделать, чтобы сперва грузилось основное содержание страницы, и только потом меню и дополнительные элементы оформления.

Это полезно и для просмотра сайта с мобильных браузеров и для слепых (а самый Великий Слепой — Google).

0 комментариев
17-04-2009 10:36 0

Необходимо использовать элементы по-назначению! Таблицы-для таблиц, а не для верстки сайтов!

2 комментария
SysAdminb 24-05-2009 15:55 0

yura, О. Неужели хоть кто-то вспомнил о семантике?

smaller 24-05-2009 16:05 0

yura, ну нет... тут даже когда в Ворде делаешь форматирование без таблицы зачастую не обходится... так что если можно использовать и удобно (а зачастую по другому нельзя), то надо использовать

05-05-2009 21:58 0

блочная модель понятнее

0 комментариев
26-09-2010 00:02 0

Щяс все дрочат на ДИВную. А табличную называют устаревшей и использованием таблиц не по назначению.

4 комментария
opera.rulez 26-09-2010 04:32 +1

JAre, А есть какой-нибудь аргумент за дивную вёрстку, кроме того, что она модная?

JAre 26-09-2010 10:17 +1

opera.rulez, Конечно, если действительно интересно - погугли. Потому, что я всех не вспомню. По моему еще и на хабре что-то было.

ЗЫ. Кажется, один из самых веских это "Двиы были сделаны для этого. Таблицы - для другого" :)

SysAdminb 26-09-2010 17:37 +1

JAre, Пихать дивы во все места ничуть не лучше табличной верстки. Ибо есть такая вещь, как семантика.

То бишь, использование каждого элемента согласно его назначению.

Просвещайтесь.

opera.rulez 27-09-2010 15:40 0

SysAdminb, Именно. Див — нейтральный элемент, начисто лишённый какой-либо семантики.

2 комментария
opera.rulez 26-09-2010 15:02 +2

artli.oneid.ru, Боянъ бо вѣщии, аще кому хотяше пѣснь творити, то растѣкашется мыслию по древу, сѣрымъ вълкомъ по земли, шизымъ орломъ подъ облакы. Помняшетъ бо, рече, първыхъ временъ усобицѣ. Тогда пущашеть 10 соколовъ на стадо лебедѣи, которыи дотечаше, та преди пѣснь пояше старому Ярославу, храброму Мстиславу, иже зарѣза Редедю предъ пълкы Касожьскыми, красному Романови Святъславичю. Боянъ же, братие, не 10 соколовъ на стадо лебедѣи пущаше, нъ своя вѣщиа пръсты на живая струны въскладаше, они же сами княземъ славу рокотаху.

artli.oneid.… 26-09-2010 17:28 +1

opera.rulez, Творитѣль сего жгѣтъ

11-02-2013 18:11 0

После того, как сверстал на дивах огромный интерфейс - нихуя не боюсь.

0 комментариев
11-02-2013 20:52 0

На таблицах верстают только мудаки.

1 комментарий
opera.rulez 30-11-2016 21:30 0

NightmareZ, Таблицы есть? А если найду?

web.archive.org/web/20160222161231/ely-a...

16-04-2009 21:34 0

как получится. обычно таблицами.

0 комментариев
16-04-2009 21:40 0

Я тока ими и умею=)

0 комментариев
16-04-2009 21:42 +3

То, что таблицы зло - это миф. Дивы попросту не могут многое, что могут таблицы. Даже на этом сайте не удалось бы ввести 2х строчные заголовки холиваров, потому что нет у дивов позиционирования по нижнему краю. Как и по центру вертикали.
Дивы только для простых, блочных сайтов. Таблицы для всего того же, только ещё больше.

Только один минус - много кода.

11 комментариев
darkside 17-04-2009 02:17 0

vosmoi, дивы всесильны если постараться, и позиционирование еще не главное препятствие )

Sai 22-04-2009 23:29 +1

vosmoi, На самом деле, по стандартам css с помощью свойства display:table можно сделать так, чтобы дивы вели себя как таблицы. Но проблема в том, что наш любимый браузер вплоть до 7-й версии не поддерживает это свойство. Так что это проблемы ие, а не блочной верстки. Вот отомрет ие ниже 8-го, и будет счастье))

Anf 11-02-2013 16:50 0

vosmoi, А что мешает сделать обычный отступ сверху и фиксированную высоту? А если сайт в em'ах, то проблем с этим вообще не может быть.

vosmoi 11-02-2013 17:07 0

Anf, фиксированные отступы не подойдут, потому что текст бывает в одну, две и даже три строки. В каждом из этих случаев пришлось бы делать разный отступ.

Сейчас проблема решилась и дивами можно делать все, потому что к ним можно полноценно применять свойства таблиц, т.е. display:cell и т.д. На момент написания этого поста не все браузера это умели делать корректно.

Сейчас таблицы не обязательны, потому что дивы можно превратить в таблицы.

Anf 11-02-2013 17:58 0

vosmoi, Хорошо. Без фиксированных.
jsfiddle.net/nBgT7/1/

display:cell
Имхо костыльно.

vosmoi 11-02-2013 18:08 0

Anf, не могу сходу сказать в чем была бы проблема, потому что только когда у тебя десять слоев дивов, у которых самые разные позишены, тогда в полной мере всплывают все глюки и проблемы кроссбраузерности. Когда я верстал были проблемы, но этом было слишком давно, чтобы вспомнить в чем именно.

Tro 11-02-2013 18:09 0

vosmoi, Ты до сих пор на этой стороне?

vosmoi 11-02-2013 18:12 0

Tro, у меня нет приципиального негатива к таблицам. В каком-то смысле, они все еще со мной, когда дивы наследуют их свойства) Не могу представить сложную верстку без дивов-таблиц.

opera.rulez 11-02-2013 19:48 +1

vosmoi, display:table-cell — это трансвестит или волк в овечьей шкуре. Он же рендерится как таблица. Отличие от TD только в том, что писать меньше, можно сэкономить на тэгах, а визуальные свойства вынести в CSS-файл.

У настоящей дивной вёрстки есть принципиальное отличие, заключающееся в другом алгоритме вычисления позиций. Например, блок, не поместившийся в строке, может быть перенесён на следующую строку, в то время как ячейку таблицы переносить на другую строку категорически нельзя.

vosmoi 11-02-2013 21:02 +1

opera.rulez, дивы разъезжаются чуть что не так. Таблицы стабильнее в качестве каркаса или если требуется вывести данные похожие на табличные. На холиварсе сложная структура, что-то тянется, что-то не тянется, одно в другом, разные позишены - можно гарантировать, что без глюков обычными дивами все это не сверстать. Да и ради чего выпендриваться? И, например, на деве таблицо-дивами ведь не я придумал верстать, первая версия верстки была от Саши, а я ее потом только доводил до ума. Его трудно заподозрить в неопытности.

opera.rulez 11-02-2013 21:04 +1

vosmoi, Вот потому и считаю, что всему своё место. А крайности (типа только таблицы или только блоки) для любителей словесных перепалок.

16-04-2009 21:46 0

ЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫ

0 комментариев
17-04-2009 10:29 0

Набор дивов нельзя нормально центрануть, кроссбраузерно. При отключении таблицы стилей все нахрен разваливается. Конечно же, идеальный вариант это комбинация табличной верстки и верстки с применением дивов.

11 комментариев
yura 17-04-2009 10:33 0

qik, А зачем стили отключать? Разве что один раз в год - Naked CSS, так в этом и прикол :)

darkside 17-04-2009 15:05 0

qik, Чего там нельзя центрануть кроссбраузерно? )

SysAdminb 23-05-2009 17:20 0

qik, Сколько не читаю, все удивляюсь, какая же каша в голове у народа.

vosmoi 23-05-2009 17:39 0

darkside, вертикального позиционирования нет у дивов.

darkside 24-05-2009 13:38 0

vosmoi, display: table-cell; vertical-align: middle; %)

vosmoi 24-05-2009 14:45 0

darkside, ie такие приколы жует и выплевывает

darkside 24-05-2009 15:38 0

vosmoi, ие6 переваривает )

vosmoi 24-05-2009 18:24 0

darkside, Только что перепроверил - не переваривает)

darkside 24-05-2009 19:00 0

vosmoi, http://www.jakpsatweb.cz/css/priklady/vertical-align-valid-solution-en.html

vosmoi 24-05-2009 19:42 0

darkside, про позишены:абсолют я знаю. 10 лишних строк кода и головная боль на будущее - с позишенами всегда что-нибудь приключается в сложной верстке. Все это мозгоебство без смысла. Пока ИЕ не отомрет таблицы лучшее решение.

mob_dp 12-06-2009 20:05 0

qik, Тьфу блин, отимел себе моск за 2 часа попыткой нормально сделать 2 колонки, влюнул и всунул табличку.

Ессно 1-ячеечные таблицы не признаю, но колонки онли таблицами терь делаю.

22-04-2009 09:16 +1

У дивов больше проблем с мультиброузерностью в сложных сетках. Только настроишь позишены, чуть поменял - и опять где-нибудь поедет. Таблицы жеские в поведении, более надежны.

2 комментария
darkside 22-04-2009 19:07 0

vosmoi, У вас пузырики всё еще едут на таблицах )

vosmoi 22-04-2009 20:42 +1

darkside, Где?) Если имеется ввиду пробел между пузырями и плашками, то это я знаю - там надо в алгоритмы вывода лезть, верстка не виновата... С этим можно пока повременить, более важные есть штуки

23-05-2009 17:51 +2

Без таблиц некоторых вещей нельзя было сделать на этом сайте)

Например, на главной странице нельзя было бы сделать названия сторон в 2 строки, так как у дивов нет valign и кроссброузерно его не сделать. По этой же причине не вышло бы сделать стрелочек сбоку от аргументов.

Даже такую мелочь, как белый задник под никнеймами в аргументах, без таблиц бы было трудно реализовать. Можно, но мозгоебно.

И сверстать на все броузеры 4 колонки с разным процентным соотношением ширины и отступов - очень сложно. А когда сделаешь и через время попробуешь что-то изменить, обязательно словишь баги.

Поэтому я использую дивы только для простых сайтов, где все стандартно.

0 комментариев
24-05-2009 18:35 0

Таблицы удобно и привычно... Div'ы - мода...

0 комментариев
26-09-2010 01:52 +1

Там, где нужна таблица - верстаем табличной. Где не нужна - блоки. В общем, комбинированная верстка. Какой же дебильный вар, епты. В нейтрал.

0 комментариев
28-09-2010 11:10 +1

в Вилларибо и Виллабаджо дедлайн. и пока в деревне Вилларибо епутся с div'ами, в Виллабаджо уже давно всё свертали таблицами и рубятся в кваку.

2 комментария
opera.rulez 28-09-2010 16:45 0

fhfh, Табличная вёрстка — не зло. Зло — это привязка к фиксированной ширине страницы (мониторы-то у всех разные!), а также указание размеров в пикселях там, где можно в относительных единицах em и ex (шрифты тоже могут быть разными!).

Так что если не фиксировать то, что не надо, то таблицей сверстать проще.

fhfh 28-09-2010 21:53 +1

opera.rulez, да я как бы и не спорю

04-10-2010 23:49 +1

Вот, оказывается, когда ещё спорили о дивной и табличной вёрстке!

0 комментариев
11-09-2011 04:22 0

Интересная статья на эту тему: webdesign.site3k.net/?/sovet/verstka.htm ...

Автор за комбинированную.

Таблицы должны использоваться там, где нужен жёсткий каркас. Например, если открыть сайт мобильным браузером, то блоки могут вытянуться в одну линию. Хорошо это или плохо? Зависит от содержимого сайта. На этом сайте, например, это может привести к тому, что топы юзеров и варов и колонки с аргументами вытянутся в один длинный столбик. При табличной же вёрстке нужен зум или горизонтальный скроллинг или позволить сужать колонки.

Пример, когда нужна блочная вёрстка: список популярных снимков на главной странице Яндекс.Фоток. Если монитор широкий, количество колонок автоматически увеличится. Если монитор узкий, количество колонок автоматически уменьшится.

Пример, когда нужна табличная вёрстка: данные, которые при любых условиях должны находиться напротив друг друга.

Для того, чтобы полностью доверять блочной вёрстке, нужно либо придумать дизайн, который не портится от переносов блоков на новую строку, либо уметь их закреплять.

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