HTML+CSS+JavaScript

На сайте http://www.shtabeler.ru делаю выпадающее меню при наведении на картинку с товаром. Верхнее и нижнее изображение видно, а вот с сердинкой проблемы.
Струтура следующая

<ul>   <li>...</li>   <li>...       <ul class="dropdown-menu">          <div class="meedle">               <li>....</li>              </li>....</li>              .....          </div>       </ul>    </li> </ul>

К ul.dropdown-menu делаю изображение сверху и внизу. Также пытаюсь сделать серединку изображение к блоку .meedle с repet-y. Но оно не показывается. В чем может быть ошибка?

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

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

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

Подскажите пожалуйста как мне быть со списком в середине. И что значит "меню прыгает по высоте", как это убрать?

Это и есть наложение?

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

Ну разве же такое возможно допускать на странице?

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

Меню не будет производить впечатления скачущего, если блок активируемый действительно раскрывается, с анимацией или без нее не важно, а не так как у вас - впечатление появляющегося "чужеродного слоя" существующего само по себе, еще и тенями вдобавок оторванное от остального меню. Вот и получается вываливается этот слой, не важно что под заголовком нужным, все равно он сам по себе, а все остальное меню скачет, а зачем?

PS. Кстати, у вас блок контента съезжает влево по отношению к шапке и слайдеру. И уберите бордюр на кнопках управления слайдера.

Ссылка Печать не должна распечатываться.

Откройте у себя печать, но в качестве имени принтера выберите Microsoft XPS Document Writer (если у вас Win платформа), и установите флажок Автоматически открывать XPS-документы в средстве просмотра XPS (хотя можно и отдельно открыть файл). Можно указать и параметры бумаги, по умолчанию это А4.

Будет произведена печать в файл, но именно так и будет выглядеть результат печати. При формате А4 изображение вашего "самоката" будет разрезано на двое, с печатью каждой части на своей странице.

На счет меню понял, буду исправлять. Но на мой конкретный вопрос так ответа и не получил. Как же исправить, чтобы в середине выпадающего блока к элементу li была применена картинка?

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

Дайте тогда примерную ссылку на такого плана меню. Уже пробовал конкретно задавать у первого элемента выпадающего списка картинку, у нижнего другую картинку, а обычный элемент выпадающего списка изображение повторялось по оси y. Но так ничего и не выходит. Если бы найти такой пример, то сразу бы сообразил что к чему.

Кое как сделал. Но теперь список вылезает за блок. padding-left не помогает. Может здесь скажите в чем причина

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