Как вы справляетесь с табличной структурой на css???

12
lazio
На сайте с 05.10.2006
Offline
47
1087

Собственно сегодня нужно сделать страничку интернет-магазина, где товары расположены в виде таблицы, что бы понятней было приложил файл... Вот и думаю, то ли не дурить голову и сделать таблицу, то ли как-то покрутиться и сделать чисто на дивах. Кто как справляется с такими задачами, если дивами то предлагайте способы ;)

сам нашел как сделать колонки одинаковой высоты на 100% родительского блока, но у блока должна быть фиксирована высота, подругому у меня никак не получилось....

спасибо.

jpg primer.jpg
COMFI - Начни Зарабатывать! (http://affiliate.comfi.ru/a2/466735/Program-Overview)
Алексей Барыкин
На сайте с 04.02.2008
Offline
272
#1

Таблицы - некузяво.

Пример верстки слоями - http://promo-pharm.ru/category3

Товары располагаются в несколько столбцов, количество столбцов зависит от размера экрана браузера (резиновая верстка).

dkameleon
На сайте с 09.12.2005
Offline
386
#2

таблицу делайте таблицей и не мучатесь :)

Дизайн интерьера (http://balabukha.com/)
[Удален]
#3
Алексей Барыкин:
Пример верстки слоями - http://promo-pharm.ru/category3
Товары располагаются в несколько столбцов, количество столбцов зависит от размера экрана браузера (резиновая верстка).

это не резиновая верстка это плавающие блоки :), на сколько я понимаю в данном ТС случае это не пройдет из-за разной высоты блоков (и высота блока не известна заранее)

если очень хочется на дивах

то используйте конструкцию

div.blok1 {float:left;}

:lang(ru) div.blok1 {float:none;display:table-cell;vertical-align:top;}

div.blok2 {float:left;}

:lang(ru) div.blok2 {float:none;display:table-cell;}

для каждой пары блоков при этом

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="ru" xml:lang="ru">

lazio
На сайте с 05.10.2006
Offline
47
#4
Алексей Барыкин:
Таблицы - некузяво.
Пример верстки слоями - http://promo-pharm.ru/category3
Товары располагаются в несколько столбцов, количество столбцов зависит от размера экрана браузера (резиновая верстка).

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


если очень хочется на дивах
то используйте конструкцию
div.blok1 {float:left;}
:lang(ru) div.blok1 {float:none;display:table-cell;vertical-align:top;}
div.blok2 {float:left;}
:lang(ru) div.blok2 {float:none;display:table-cell;}

можно где-то посмотреть пример?

[Удален]
#5

lazio, совместите http://blog.html.it/layoutgala/LayoutGala38.html

и http://hotwine.ru/ готового шаблона у меня нет :)

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

HungryFoerster
На сайте с 03.08.2007
Offline
72
#6
Алексей Барыкин:
Таблицы - некузяво.

Типа приглашение к холивару? Таблицу слоями делать - кода меньше не станет 🚬 И еще это философски неверный путь.

читаю @frazasutra (https://twitter.com/frazasutra)
[Удален]
#7
HungryFoerster:
И еще это философски неверный путь

вообще-то в данном случае это как раз не табличные данные, а блочные :)

Алексей Барыкин
На сайте с 04.02.2008
Offline
272
#8
HungryFoerster:
Типа приглашение к холивару? Таблицу слоями делать - кода меньше не станет 🚬 И еще это философски неверный путь.

Кесарю кесарево - слесарю слесарево.

Таблицы - для табличных данных.

Слои для разметки.

Как в случае разметочной таблицы будете делать версию страницы для печати?😂

Пример тот же - http://promo-pharm.ru/

mfl
На сайте с 16.10.2006
Offline
134
mfl
#9

Что тут думать, не надо извращений, делайте таблицу.

В данном случае, какие плюсы дивной верстки по сравнению с табличной?

Как в случае разметочной таблицы будете делать версию страницы для печати?

А в чем конкретно сложность? Что на таблицах страницу для печати не делают?

Алексей Барыкин
На сайте с 04.02.2008
Offline
272
#10
mfl:
Что тут думать, не надо извращений, делайте таблицу.
В данном случае, какие плюсы дивной верстки по сравнению с табличной?


А в чем конкретно сложность? Что на таблицах страницу для печати не делают?

Много что делают на таблицах.

На слоях проще на порядок - поотключал в css ненужные блоки с навигацией и прочей шнягой и на печать.

<link href="/css/screen.css" rel="stylesheet" type="text/css" media="all"> <!--Для экрана-->

<link href="/css/print.css" rel="stylesheet" type="text/css" media="print"> <!--Для принтера-->
12

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