Как разделить в меню сайта пункты меню?

голоса: 0

Добрый день, Гуру, проблема с редактированием стиля, захотелось что бы в меню все надписи были разделены квадратиком! сделал но чуточку не так, как поправить не догыдываюсь (НЕ ЗНАЮ) что прописать! сайт , фото прилогаю!

Адрес сайта https://scool11.my1.ru/
| Автор: | Категория: Дизайн сайта

Ответов: 1

голоса: 0
 
Лучший ответ

По сути меню корректно работает и все прекрасно смотрится без рамок так как пробелы между пунктами есть и все хорошо, но добавляя рамку вы сами себе создаете проблему которую потом пытаетесь решить.

В таблице стилей CSS в строке 69 ищите стили:

#catmenu ul ul li a,#catmenu ul ul li a:hover,#catmenu li li a.uMenuItemA,#catmenu li li.uWithSubmenu:hover > a {display:block;padding:7px 10px;height:auto;line-height:normal;margin: 0 0 1px;font-size:11px;color:#fff;}

выделил красным, увеличивайте данное значение чтобы увеличить промежуток между пунктами меню в выпадающем списке. Выделил на скриншоте http://joxi.ru/v293QxEHGxaVKr этот пробел не убрать так как это проблема из-за того, что меню в две полосы, если убрать выше, создадим проблему для пунктов с выпадающим меню для пунктов что ниже. Сократите названия для пунктов меню, тогда оно будет в одну строку без переноса и все будет хорошо.

| Автор:
Выбор ответа лучшим | | Автор: Максим Юрченко
а возможно чтобы пункты были не слева или с права а были по середине?
Максим Юрченко,

Поправьте тогда стили в строке 60:

#catmenu ul ul li a,#catmenu ul ul li a:hover,#catmenu li li a.uMenuItemA,#catmenu li li.uWithSubmenu:hover > a {display:block;padding:7px 10px;height:auto;line-height:normal;text-align: center;margin:0 0 3px;font-size:11px;color:#fff;}

добавьте выделенное.

...