Alan_Gray

Ого, как всё сложно. Во времена вёрстки table'ами проблем с вертикальным выравниванием не было проблемы. Ждём CSS4 со свойствами content-valign и content-align. И рабочий height в процентах, который будет за 100% брать всю высоту окна браузера, наконец-то. И где это всё?

960px.

Реально так никто и не смог ответить, чем же <photo></photo> со стилем photo{;}, проигрывает <div class="photo"></div> со стилем .photo{;} ? Вот реально, чем хуже? Неужели вы всерьёз пологаете, что вам придётся ковырять серьёзный сайт с тегами по типу <dsfdgfh-sdghfgsdhfsdh-hjdfsd-hjdfgshdhs></dsfdgfh-sdghfgsdhfsdh-hjdfsd-hjdfgshdhs> с соответствующим стилем dsfdgfh-sdghfgsdhfsdh-hjdfsd-hjdfgshdhs { ;} ??? Да вы неадекватны, серьёзно. Откуда такая злоба и ненависть к самим себе? swetlana Ну и херню же вы написали.

А если бы можно было на заморачиваться о том, что у 60% пользователей (пользователи IE), сайт будет отражаться не так как надо, а у пользователей FF, Opera, Safari, Chrome — всё будет впорядке, вы бы плакали от этого или наконец вздохнули бы с облегчением? Что-то непонятно, что вы тут так праведно защищаете.

А вы используете IE?

Ну... В том же примере, важно что? Ссылки. Если упростить, то будет только: <nav><a href="">Ссылка</a></nav>. Это даёт понять, вот типа тут навигация, ага, а внутри вот простые ссылочки. Ясно, это ссылки навигации. А всё остальное — чисто элементы оформления, которых парсить или как-то индексировать, инспектировать, В общем-то не нужно. Оно нужно только для оформления страницы. Зато достаточно удобно понять и писать нужно меньше. Суть не изменилась. Ну напиши я всё тоже самое (я сначала так и сделал), но с использованием <div class=""> — почему это было бы лучше и православнее? По сути имеют смысл только текст (который разделяется на заголовки, параграфы), ссылки, картинки и другие встроенные медиа-элементы с их мета-данными. Завернуть картинку в тэг <photo></photo> и написать в CSS как это фото оформляется, какой бордюрчик имеет и ставится на странице — по приколу. Да, всё ради бордюрчика <div class="photo"></div> против <photo></photo>. Экономия символов, и читабельность — к чему многие стремятся, налицо Я рад заменить надоевшие блоки div'ов, которым всё равно все свойства приходится определять в CSS, на мне понятные и логичные тэги. В этом я и нахожу прелесть этой возможности. Раньше я вообще верстал только тэйблами, и не парился на счёт выравнивания по вертикали и горизонтали, растяжке по %, в том числе по высоте (height), а теперь парюсь! Ну хоть об однообразии div'ов теперь можно забыть. П.С. XML в веб-дизайне не знаю как юзать, честно признаюсь. П.П.С. Пробовал свои тэги очень давно, но оно не сработало. Что логично надо полагать, ведь есть только определённые тэги. Да, это было очень давно. > stars Вы делаете костыли для калечного IE (судя по репликам). Какая в этом логика и смысл? Да никакой. Вы походу не ищите лёгких путей — "Мсье знает толк в извращениях! " Так что мою логику вы не поняли, она же слишком проста и наивна, чёрт.

IE? Фу... XDDD Валидность для инвалидных браузеров должна мало волновать дизайнеров. Плясать с костылями для разных браузеров, это забава для любителя извращений. Нужно и хочется больше думать о дизайне и вёрстке, чем о валидности кода. Существует один стандарт, а непонимание или перевирание этого стандарта — калечность браузера. HTML5, потому что раньше я не замечал, чтобы это работало, пробовал специально. Только более менее новые браузеры это задействуют. Меня лично это порадовало. Во многом не нужно больше втыкать в div'ы и в другие тэги параметр class="". Это банально сокращает объём кода. Кроме того, ни в каких официальных документах такие возможности не описаны и вообще по логике есть только строго определённые тэги, других не существует. Поэтому это финтифшлюшка и фича, не обязательно HTML5, но современных браузеров. Раньше писали: <div class="header"></div>, а теперь в HTML5 просто <header></header>. Почему же нельзя писать и другие тэги? Например <brain></brain> или <hands></hands>, чисто для логичности и понятности. Это можно не использовать, никого же не заставляют Просто решил поделится своим открытием, а вдруг кто не знает? XD

Незнаю, известно вам или нет, работает во всех современных браузерах (Opera 10 (в 9.6 тоже кстати), Chrome, FF 3.5, в других не проверялось) Можно создавать свои тэги. Придумывать любое имя тэгу. К примеру: <its-work>Это работает!</its-work> Стиль определяется в CSS. По умолчанию действует как тэг <span>, почти ничего не добавляет. Вот пример странички: http://critgame.narod.ru/HTML5_experiment/index.html Посмотрите на меню. Выглядит нормально. А тэгами там оформлено всё иначе, нет привычных div'ов. CSS выглядит так: nav item {display: inline-block;} /* Отдельный блок ссылки в меню */ nav item do {display: block; padding: 16px 32px 16px 32px;} /* Для внутренного содержания блока, отступ внутри */ nav item[class*=begin] do {background: url('nav_mask_round.png') left top no-repeat;} /* Если начальный элемент, то слева будет "маска", перекрывать часть фона */ nav item[class*=end] do {background: url('nav_mask_round.png') right bottom no-repeat;} /* Если начальный элемент, то справа будет "маска", перекрывать часть фона */ nav item this {display: block; padding: 0px; margin: 0px; height: 16px; background: url('nav_mask.png') center bottom no-repeat;} /* Стрелочка под тем элементом который как-бы выбран. Здесь стрелочка не показывается, "маска" скрывает всю часть снизу */ nav item[class*=selected] this {display: block; padding: 0px; margin: 0px; height: 16px; background: url('nav_mask.png') center top no-repeat;} /* А здесь стрелочка видна, элемент как-бы выбран */ А так HTML код: <nav style="display: inline-block; padding: 0px; margin: 0px; font-size: 21px; background: url('nav_backface_1.jpg');"> <item class="begin selected"> <!-- Отдельный блок, начальный и выбранный --> <do><a href="###">Блог</a></do> <!-- Верхний блок --> <this></this><!-- Нижний блок (аккурат под верхним), с направляющим треугольничком --> </item><item class=""> <do><a href="###">Проекты</a></do> <this></this> </item><item class="end"> <do><a href="###">О нас</a></do> <this></this> </item> </nav> Тут вместо привычных div стоят совершенно другие имена тэгов, а получается всё тоже самое. В CSS использованы селекторы. К сожалению нельзя добавить какой-то свой параметр и выбрать его селектором, это не работает. Типа такого: <item begin="true">, CSS: item[begin=true] { ;} Или вообще типа такого <item begin>, CSS: item[begin] { ;} Последнее кстати частично работает. Можно толко известные параметры, такие как class — они доступны для любого тэга. Зачем это нужно? А так интереснее и во многом облегчает задачу, делает код ещё понятнее, конечно если вы не пишите непонятные или дурацкие имена тэгов. Семантически полезны только зарезервированные тэги, по типу <nav>,<section>,<aside>,<time>, говорят поисковые системы на них будут ориентироваться. Ну а такие разнообразные человеческие тэги будут полезны для людей. Осталось только добавить в CSS content-align: [ left | center | right ] и content-valign: [ top | center | bottom ] (аналогичных <td align="" valign="">), работающих в блоках как надо, вместо не работающего как нужно vertical-align: и не подходящего для этого по смыслу text-align. И тогда вообще будет прелестно.