Неупорядоченный список

[DjTarik]

Собственно - сам вопрос:

Реально ли сверстать такое меню на неупорядоченном списке?

Проблема в том, что я не могу придумать, как сделать эти разделители...

Есть у кого-нить варианты?

Был вариант сделать через фоновый неповторяющийся рисунок, но элементы li не растягиваются по высоте на 100%...

[Джин]

<style>

.menu {float:left; padding:2px 15px; background:url(./img/border.gif) no-repeat right center;}

</style>

<div class="menu">www.DanielFocusLister.com</div>

<div class="menu">Home</div>

<div class="menu">About Us</div>

border.gif это и есть разделитель....

я правильно понял что Вы хотите? только не понимаю зачем списки использовать О_о без них очень даже не плохо делается все

Edited October 26, 2008 by Джин

[rash]

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

[Джин]

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

для отделения чертой предназначен тег <hr>.. т.е. логично его использовать? однако большинство пользуются тегом border

[DjTarik]

Дивамии и таблицами это я тож сделаю =) ... Интересует именно на списках...

Как сказал rash - так семантичнее...

А на списках не получается в элементе li выровнять фоновый рисунок и сам текст ровно по центру, т.к. не получается задать li высоту 100%...

[rash]

для отделения чертой предназначен тег <hr>.. т.е. логично его использовать? однако большинство пользуются тегом border

Ну большинство не всегда право, надо заметить, и полагаться только на то, что так делает большинство, как минимум, легкомысленно.

А горизонтальную черту hr следует воспринимать не просто как декоративный элемент, а как разделитель разделов, глав, логических частей документа. А при хорошей разметке эту функцию прекрасно выполняют заголовки разного уровня, и разделение с использованием hr нужно не так уж и часто. Чисто декоративную роль можно возложить на border, это нормально.

[Иван Шумов]

вот как раз вестал что-то похожее как я понимаю ТЫК

[DjTarik]

вот как раз вестал что-то похожее как я понимаю ТЫК

Ха! =) Прикольно... Сделать из списка блочный элемент и при помощи "флоат - лефт" их выровнять... А я список делал инлайновым... Про блок даже и не подумал...

P.S. Хотя сам это проблему решил через просто тупое добавление этой границы через "имг" и в отдельный li...

Что-то типо этого, если кому интересно:

<ul>
					<li><img src="images/li_bg.gif" class="li_bg" alt="" title=""><a href="#">Home</a></li>
					<li><img src="images/li_bg.gif" class="li_bg" alt="" title=""><a href="#">About Us</a></li>
					<li><img src="images/li_bg.gif" class="li_bg" alt="" title=""><a href="#">Contact Us</a></li>
					<li><img src="images/li_bg.gif" class="li_bg" alt="" title=""><a href="#">Help</a></li>
					<li><img src="images/li_bg.gif" class="li_bg" alt="" title=""><a href="#">Policy</a><img src="images/li_bg.gif" class="li_bg" alt="" title=""></li>
				</ul>

Ну и кое что в классах прописал...

P.S. Но Ванин метод нужно запомнить... Не раз ещё пригодится... =)))

[Иван Шумов]

Да пользуйтесь на здоровье кода поменьше, css дофига, но результат универсальный раз, кросбраузерный два. ширина элементов задана для 6ого ослика... можете попробовать убрать - посмеётесь :-D вообще эти пляски с бубном мне 3ий раз за месяц пригодились, но пока лучше ничего не нашел... (я про слои и спаны как боковые бэграунды)

[rus]

Да пользуйтесь на здоровье кода поменьше, css дофига, но результат универсальный раз, кросбраузерный два. ширина элементов задана для 6ого ослика... можете попробовать убрать - посмеётесь :-D вообще эти пляски с бубном мне 3ий раз за месяц пригодились, но пока лучше ничего не нашел... (я про слои и спаны как боковые бэграунды)

Иван, а нафига такая вложеность большая?

li div cpan?

Разве просто li не достаточно?

<li style="width: 91px;"> - это потому что не хотелось каждому свой класс прописывать?

Edited October 26, 2008 by rus

[Иван Шумов]

li недостаточно - могут случиться ОЧЕНЬ каверзные ситуации. а SPAN да .. не люблю классы, предпочитаю лесенки, ну это ИМХО, мой стиль так сказать.