http://www.jakpsatweb.cz/css/css-vertic … ution.html
скролить вниз до первого попавшегося кода.



написано что это хак для IE. Как он работает?

Хм... Там же выше описано:

Then both syntax are merged. I use the Pixy's underscore hack, but with sign #. A CSS property written with the underscore on the start is visible for Internet Explorer (all versions but IE 7), property with # on the start is visible for all IE version (IE7 included). But such written property is invisible for any other standard browser (e.g. Explorer interprets _position: absolute; unlike other browsers). Underscore hack seems to be valid, but if you don't want to use it, you may use the more structured code below (not for IE 7)

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

AlexShop, ты не правильно подходишь к вопросу. Им не надо "как проще". Им надо "на дивах". Простота и эффективность здесь значения не имеют. Здесь ПРИНЦИП.

не совсем понял связь между каким-бы там ни было способом верстки и хаком цсс…

karamba, объясняю: наибольее обильное использование хаков на практике характерно для "маниакально-дивной" верстки. Под девизом "порву себе задницу -- но таблицы использовать не буду".

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

Crazy писал(а):

karamba … Под девизом "порву себе задницу -- но таблицы использовать не буду".

Очень хороший и правильный девиз.

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

Crazy,

bong13 писал(а):

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

[ произносится с серьезным до судорог лицом ]

Если вспомнить про интеграцию с CMS и толщину каналов, то решение становится и не простым, и не эффективным.

P.S. Я здесь уже упоминал пару раз, что верстать нужно в PDF. При этом шутил я не более чем на 30%…

Crazy писал(а):

Если вспомнить про интеграцию с CMS и толщину каналов, то решение становится и не простым, и не эффективным. P.S. Я здесь уже упоминал пару раз, что верстать нужно в PDF. При этом шутил я не более чем на 30%…

Зато мой вариант будет работать на 100% компьютеров, с 100% успехом.

bong13,

Нифига, а в Linx и иже с ними?

Jamakaser, а alt'ы никто ставить не запрещал.

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

НАИМЕНОВАНИЕ ЦЕНА ОПИСАНИЕ
название 1 44 здесь текст
название 1 44 здесь текст
название 1 44 здесь текст
название 1 44 здесь текст


Так вот он нагрузил css на полторы страницы и кучу дивов. Да не вопрос, было без таблиц. Но оно надо вообще?
Это просто какой-то гон так противиться от облегчения работы.

bong13 писал(а):

Зато мой вариант будет работать на 100% компьютеров, с 100% успехом.

Не будет. Во-первых, в линксе не будет работать ибо не машиночитаем, а во-вторых -- не в этом разделе, поскольку он не будет стандартным, не будет являться ни частью, ни вторичным от SGML хе-хе

tentoys, ты ошибаешься. Со стандартами все будет в шоколаде -- тэг IMG никто не отменял.

Машинночитаемой станет меньшая часть -- это да. Но все будет честно.

Crazy писал(а):

tentoys, ты ошибаешься. Со стандартами все будет в шоколаде -- тэг IMG никто не отменял.

Неа.… если поместить огромную картинку в таки хтмл -- да, прокатит, но это уже будет не чистый эксперимент. Чистым и свободным от хаков он будет, если, к примеру я дам здесь ссылку на графический файл, лежащий где-нибудь на сервере. И это будет тупик, ибо линки с этой картинки куда-нибудь дальше можно будет получить (увидеть) только зрительно, но никакого hypertext, никакого markup и уж точно никакого generalized не будет.
К вопросу о топике -- я готов делать всё по-возможности на дивах, отдавая себе отчёт в том, что таблицы созданы для размещения в них данных, но если какая-либо задача может быть решена таблицами лучше -- почему б и нет. Правда, не очень много мне приходилось сталкиваться с таковыми. Да, именно дивная вёрстка содержит больше всего хаков и уловок, но это лишь потому, что нет полного и безоговорочного соблюдения тех самых стандартов, которые по отношению к практике и практикам представляются лишь как библия (или недостижимым кодексом строителя коммунизьма)

tentoys писал(а):

Правда, не очень много мне приходилось сталкиваться с таковыми.

Ни разу не верстал дизайн, нарисованный поверх модульной сетки? Она как правило имеет выраженную табличную структуру.

Crazy писал(а):

наибольее обильное использование хаков на практике характерно для "маниакально-дивной" верстки.

опять 25… Тема традиционно спрыгнула в область знаний о знаниях и о стартовом вопросе благополучно забыто. Поэтому потрещу и я за жисть
Я не отношу себя ни к ярым противникам табличников, ни к оголтелым блочникам (хотя и ближе к ним), но думаю, что если у чела руки растут не из традициооных для них мест, то к чему бы он ни прикоснулся получится сделанным из того же места, откуда и руки растут. И не важно, дивы это или таблицы. Для дивов уже столько готовых работающих рациональных решений, что наступать на обозначенные сигнальными огнями грабли нужно только для самообразования, понимания сути предмета и накопления собссного опыта. Маниакально-дивные спецы не большая экзотика сегодня, чем табличные, создающие до сих пор что-то типа:

Да, признаю, что при дивной верстке хаки используются чаще, чем при табличной, но это ведь не столько маниакальность кодера, сколько кривость девелоперов броузеров, а наличие (или отсуцтвие) дивной верстки традиционно должно диктовацца целесообразностью (кста, Kurilshik, и я верстал аналогичную шнягу блоками, потому что это было действительно нужно). Целесообразность решений у адекватных граждан диктуется функциональностью и/или например медиа, модульная сетка должна зависеть от медиа по своему определению и таблица как инструмент для ее реализации возможно очевидный и даже рациональный, но не самый оптимальный вариант в этом конкретном случае. А неадекватных граждан и их решения обсуждать весело, но бесполезно.
Верстка таблицами вовсе не отменяет необходимость зачастую разделить код для разных броузеров, в этой ветке масса примеров. Хак, как и СС, и проверки клиента джаваскриптом/пхп — всего лишь способ разделить код, который почему-то до сих пор не удается никак сделать универсальным для реализации более-менее сложной оформиловки.

Crazy, верстал. Именно об этих и таких сайтах и говорю, как о редких случаях, которых стараюсь избегать.…

Цитата:

Она как правило имеет выраженную табличную структуру.

Ага, это и пугает. Не углубляюсь в структуру движков разных cms (вот ну не программер я, так, интересующийся), но всегда хотел задать вопрос: а почему нельзя формировать код через php и блоками? Почему эти модули имеют построение табличное, а? Ну почему? Где эти золотые руки, которые пишут хорошие и правильные движки?

karamba, вот правильный треск, соглашусь и не стану спорить совсем, ага

tentoys писал(а):

но те, кто ещё больше обделён, я имею ввиду, смотрели Брайля, как же они?

Цитата:

Ага, это и пугает. Не углубляюсь в структуру движков разных cms (вот ну не программер я, так, интересующийся), но всегда хотел задать вопрос: а почему нельзя формировать код через php и блоками? Почему эти модули имеют построение табличное, а? Ну почему? Где эти золотые руки, которые пишут хорошие и правильные движки?

Например здесь. Если интересно, то есть еще русский сайт.

Я так понял есть несколько решений (поправте если что):

Первое решение: С помощью PHP выявлять что за броузер и выдавать нужный CSS код, который будет дополнять основной, т.е. править.
Плюсы: Чистенько, никаких CSS хаков
Минусы: Нет CSS кеширования. Хотя это не большая проблема, так как PHP будет выдавать не весь CSS код, а только правки необходимые для конкретного браузера. Еще PHP не разлечит Оперу и ИЕ.

Второе решение: Все это проделать в JavaScript. Тогда Оперу с ИЕ различим. Незнаю будет ли тут 100% CSS кеширование?

Третье решение: Писать один CSS код с хаками.
Плюсы: Один код для всех, это то к чему мы стремимся: к одному стандарту.
Минусы: Хаки не так красиво выглядят.

С чем легче работать? Где легче приспособится к новым браузерам?

К примеру: хаки используют баги браузеров. Если выпускается новая версия броузера, в котором только баг исправлен - хак перестает работать.

AlexShop писал(а):

С чем легче работать? Где легче приспособится к новым браузерам? К примеру: хаки используют баги браузеров. Если выпускается новая версия броузера, в котором только баг исправлен - хак перестает работать.

вот вы сами и ответили. К тому же хаки не столько выглядят не красиво, сколько влияют на валидность, если это кого-то интересует ))
Я на сегодняшний день обхожусь двумя версиями цсс-файлов: ИЕ и все остальные. Для ИЕ подключаю после основной таблицы стилей через кондишнл комментс. Таблица для ИЕ ессно гораздо короче основной, в ней только костыли или переопределения. Причем даже внутри этой таблицы стилей иногда приходится использовать хаки для разделения ИЕ<7 и ИЕ7. Ессно эта таблица не валидна по определнию. В принципе можно иметь и третью таблицу, т.е. основная, для ИЕ<7 и для ИЕ7 и подключать ее теми же СС, но я считаю это лишним, хватает возни и с этими.

karamba, приятно видеть единомышленника :) +

5 копеек в тему:

если надо что-то для ИЕ 6.0 и ниже то пишу через
* html #мой_id

и все прекрасно работает. Нужды в иных хаках не возникает

AlexShop писал(а):

http://www.jakpsatweb.cz/css/css-vertical-center-solution.html

а кто подскажет, как горизонтально выровнять блочный элемент не задавая его ширины? Т.е. как заменить "align="center" ?

IonDen666, дело вкуса. У меня есть таблица (чур не смеятся) на 1500 строк, ввести туда доп.правила — вырастет еще )) Уж проще иметь дело с отдельной куцой табличкой для разных ИЕ, по крайней мере рыться проще ))

hardy писал(а):

а кто подскажет, как горизонтально выровнять блочный элемент не задавая его ширины? Т.е. как заменить "align="center" ?

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

hardy писал(а):

кто подскажет, как горизонтально выровнять блочный элемент не задавая его ширины? Т.е. как заменить "align="center" ?

karamba совершенно справедливо отметил про 100% ширины от парента. Соответственно, делайте отступы слева и справа по 25% (а если уж пожелаете, то таки задаёте ширину Вашему блоку).

hardy писал(а):

а кто подскажет, как горизонтально выровнять блочный элемент не задавая его ширины? Т.е. как заменить "align="center" ?

Если ширина элемента менее 100% от родительского то для IE это будет text-align:center; для родтельского, для все остальных margin:0 auto 0 auto; для целевого.

karamba, tentoys, x0bbit,

Ситуация следующая: необходимо сделать горизонтально расположенное меню с выпадающими подменю. Пишу стандартный код для такой ситуации:
<ul>
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a>
<ul>
<li><a href="#">Sublink 1</a></li>
<li><a href="#">Sublink 2</a></li>
</ul>
</li>
<li><a href="#">Link 3</a></li>
</ul>

и css типа

ul {
margin: 0;
padding: 0;
list-style: none;
}
ul li {
float: left;
}

далее, нужно чтобы список с меню был отцентрирован по центру страницы. можно сделать
ul {
width: 200px;
margin: 0 auto;
}

как можно отцентровать блочный элемент без задания ширины?

ПС: можно сделать
ul {text-align: center;}
ul li {display: inline;}
но в моем случае не получается, т.к. дизайнеры намудрили с ховерами.

hardy, никак.
Ограничивайте ширину меню явно или складывайте ширины пунктов (заданные стилем или через offsetWidth например) и определяйте ее меню в начале загрузки страницы, остальное — text-align: center для парента и margin: 0 auto для меню с уже известной шириной.

появилась идея добавить 2 "пустых" пункта по бокам с шириной 50% и "display: table-row" для ul и "display: table-cell" для li. Получается как в табличной верстке, 2 крайних пункта "давят" средние, а "table-row" не дает пунктам падать на вторую строчку. Только ИЕ6 "display: table" не хавает.… ((

уж если вы заморочились эмуляцией таблицы — не проще ли сделать таблицей без извратов?
Только я совсем не уверен, что флоаты (иначе как вы расположите элементы списка в строку, не указывая явно ширины) не начнут соскакивать с одной строки без жесткого фиксирования ширины парентового контейнера.

karamba, заказчик просит полный table-less макет. а соскакивать не начнут, т.к. display: table-row для парента не даст этого сделать. вот только что придумать для ИЕ6 не знаю.

На крайняк конечно можно захардкодить ширину, но может еще найду решение, как этого не делать.