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

другой вариант вроде один - таблица вложенная в див. так было изначально.

вариант вложения дивов друг в друга - еще больше кода

Картинки к проблеме пробелов между элементами списка отношения никакого не имеют.

хорошо.
<div class=menu_block>...</div>

div.menu_block { text-align: right; }

говорю шепотом ибо стыдно:
+ я где-то вычитал, что гугль больше любит списки, чем таблицы :)

Гугль любит sitemap.xml вроде :)
Дело хозяйское, я просто в своих ужасных примерах кода стараюсь понять разработчиков языка, и представил себя на месте списка, в который засунули картинки и заставили стать строкой

Это условие выполняется пока картинки не в списке.

Нет, всегда.

)))))))

Будем спорить?
ТС нужно наложение картинок друг на друга, перекрытие. Я в списках не силен, но мне кажется они не предназначены для того, чтобы элементы перекрывались друг другом, для этого и придуманы контейнерные теги div и span - именно для размещения относительно других элементов и задания свойств, в том числе и перекрытия при минусовых отступах или абсолютном позиционировании. Список же накладывает некоторые ограничения, не считая что сомнительная экономия кода на них компенсируется необходимостью выключения дефолтных свойств: блочность, значок списка перед элементом, дефолтный отступ между элементами списка. Поправьте если неправ

не. перекрытие не нужно. достаточно «без зазора».
я сделаю все в пнг и порежу. фотки будут визуально находить друг на друга, хотя сами картинки «встык»

О чём спор? Решение то найдено.

В данном случае проблема появившегося пробела между двумя элементами <li> заключается в том, что мы сделали их встроенными (display:inline), соответетвенно все пробелы в html окружающие их учитываются при отображении (схлопываются в один), появляется промежуток между пунктаи меню. Что внутри <li> находится - по-барабану, поэтому картинки внутри, отношения к проблеме не имеют.

Что касается того, уместно ли список использовать в данном случае и не лучше ли взять таблицу / нагородить из дивов таблицу - уместно. Стили придумали как раз для того, чтобы не мешать в кучу содержимое и представление, в случае со списком мы имеем простую структуру в html из которой делаем нужное представление в стилях.

Про «сделали из блочного элемента встроенный» и т.п. комментировать не буду. Есть средство (display) - им пользуются, вот и всё.

Можно ведь pngfix(если тебе нужны посетители с IE lte 7) и просто набросать их друг на друга? Конечно нужен альфа-канал, но мне кажется это лучше чем повернутые картинки с кусками другой картинки в гугл картинках :3

Я люблю нестандартные решения, даже принял бы галерею из списков картинок(если я == заказчик и это не мешает ни выводу, ни индексации, ни доходам, хотя за вышеприведенный код сильно бы наругал), но вот чутьё подсказывает что неправильно использовать список для вывода трёх картинок в ряд. Конечно, каждый сам выбирает свою методу и нельзя советовать только начиная заниматься css & html & php, но вопрос как раз в виде теста для новичка

>список для вывода трёх картинок в ряд

Идея, конечно, странная, но если предположить, что это какое-то меню, то можно «выехать».

у меня это меню. 6 картинок ведут на 6 статей о сьемках

зачем резать картинку, когда можно её положить на background для div в котором просто будут три ссылки

#header_index_1 {
 background-image: url('те-три-картинки.png');
 height: 197px;
 width: 620px;
}
#header_index_1 a {
 display: block;
 float: left;
 height: 197px;
 width: 206px;
}

<div id="header_index_1">
 <a href="/service/wedding/"></a>
 <a href="/service/family/"></a>
 <a href="/service/photosession/"></a>
</div>

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

пасиба :)

хотя... тогда она ведь в кэш яндекса не попадет? не попадет вроде.

в данном случае не попадут в кеш три картинки, но на сайте фотостудии для поисковика нехватка трёх картинок на общем фоне не критична

>но есть косяк. порядок отрисовки обратный - в начале «контакты», в конце «главная».

Всё правильно. Ты же говоришь рисовать вправо. Поэтому первый пункт будет справа, второй — левее и так далее.

ну и про поисковики, раз тема затронута, нужно понимать что можно сделать меньше кода и «легкую» страничку, а можно нагородить огород на ровном месте ради SEO и сделать непонятно что

нужно стараться находить золотую середину

Фича, НО Я ЖЕ ПИСАЛ ТЕБЕ КАК НАДО!

http://www.linux.org.ru/forum/web-development/6105601#comment-6112249

да да) уже победили)

А если надо на право, то .test {float:right;}, или по данному топику:

.main_menu li {display:inline; float:left;} .main_menu {float:right;}

Отметь решено, если решено. А то народ взбудоражен :)