<a><div></div></a>

CEBEP · September 23, 2010

http://rk.bmstu.ru/nii/

шапка описана следующим образом

		<a href="/nii/" title="Главная страница">
			 <div class="head">
				 <div class="head_img"></div>
				 <div class="right_div_1"></div>
				 <div class="right_div_2"></div>
				 <div class="right_div_3"></div>
			</div>
		</a>

где

.head{margin-top:17px;}
.head_img{width:1000px; height:204px; background:url('img/head.jpg') no-repeat; float:left;}
.right_div_1{height:52px; background:#d6d6d6; margin-left:1000px;}
.right_div_2{height:38px; background:#f6f6f6; margin-left:1000px;}
.right_div_3{height:114px; background:#d6d6d6; margin-left:1000px;}

Совершенно закономерно валидатор объявил применение ссылки на div вне закона, но без неё уже не по пацански, и в принципе можно заменить рисунок на img, но это тоже нехорошо, к тому же это не решит проблемы с остальными дивами...

Как выйти из ситуации?

З.Ы. Буду рад критике по сайту в целом - php у него тоже домотканое.

Great Rash · September 23, 2010

Как выйти из ситуации?

<span style="display: block">?

Searcher · September 23, 2010

Вообще-то зачем всю шапку делать ссылкой? Правильно только логотип. Вырезайте его и располагайте как заблагорассудится поверх всего этого безобразия.

Центрирование в левом меню - плохая затея. Болд при наведении еще более стремная вещь.

CEBEP · September 23, 2010

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

stars · September 23, 2010

Если на сайт добавить строчку

то валидатор не ругается...

Edited September 23, 2010 by stars

CEBEP · September 23, 2010

хм...я конечно не долго гуглил но не понял почему такой эффект, мету оставил - с ней ворнинги с сайта тоже уходят

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

Edited September 23, 2010 by CEBEP

SelenIT · September 23, 2010

Как вариант - сменить доктайп на HTML5 (<!doctype html> в любом регистре), там можно.

спецификации это по прежнему не соответствует - так или иначе ссылка применена к блочном элементу

Неправда, CSS не влияет на content model (в частности, display:none не делает элемент пустым).

Вот голые строчные элементы по соседству с блочными (<a ...>...</a><div></div>), хотя букве спецификации не противоречат, глаз немножко режут (ну не люблю я анонимные блоки)...

CEBEP · September 23, 2010

Вот голые строчные элементы по соседству с блочными (<a ...>...</a><div></div>), хотя букве спецификации не противоречат, глаз немножко режут (ну не люблю я анонимные блоки).

ой, по моему вообще наоборот, блочная вёрстка предполагает подобные штуки и круче них для блочной вёрстки ничего быть не может а вот например ряд вложенных дивов только чтобы применить несколько фоновых рисунков к одной области это не круто и отдаёт таблицами Edited September 23, 2010 by CEBEP

SelenIT · September 23, 2010

Про лишние дивы для оформления — верно. Но смысл блочной верстки не в уходе от табличности, а в соответствии разметки логической структуре. А структура обычно иерархична — большие блоки, в них блоки поменьше, а уже в тех текстовый контент с разными дополнительными значениями. Не случайно же при строгом доктайпе нельзя вкладывать голый текст в <body> или <form> без блочной обертки. А сваливание явно разнородных элементов в кучу на одном уровне (если того не требует логика страницы, конечно) — это ни разу не круто, это даже не табличность, это просто беспорядок...

CEBEP · September 23, 2010

если идти к логическому завершению идеи то резлуьтат будет примерно следующий: <table><tr><td><div>...</div></td></tr><tr><td><a>..</a></td></tr></table> где не только всё разнесено по отдельным боксам но и явно показано их взаимное расположение

Edited September 23, 2010 by CEBEP

SelenIT · September 23, 2010

Как раз наоборот. Не надо путать боксы и логические блоки. Боксы и их расположение — забота CSS, включая дефолтный браузерный (именно он создает анонимные блочный боксы, если нужно), а логической структуре (оперирующей разделами, заголовками, абзацами и т.п.) нет дела до визуального отображения. А иначе зачем обрамлять ссылки меню в <li>, почему бы оставить голые <a> подряд, задав им блочное отображение в стилях, разметки ж еще меньше будет?

CEBEP · September 23, 2010

ну да, голые ссылки это грубовато... хотя...

SelenIT · September 23, 2010

На самом деле те дивы, к которым я приколупался, там (в меню) вообще не нужны. Уж где-где, а в них пережитки табличности изо всех щелей высовываются. Визуальные разделители между пунктами просто просятся в фоны для LI-шек (тода и структура станет явной и самоочевидной - список однотипных ссылок). Вот разметка контактов <br>-ками, это похуже. Я бы, наверное, разметил их <dl>-кой c микроформатом hCard внутри...

Sign In

<a><div></div></a>

Question

Link to comment

Share on other sites

12 answers to this question

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Обсуждения

Important Information