Самописное меню на CSS, выравнивание надписи и картинки

голоса: 0

Здравствуйте. Добавил на сайте свое меню "Меню сайта", регулируемое css-стилями. Добавил картиночку в меню, текстики.
Если в меню надпись длинная, срабатывает автоперенос на другую строку, и, как следствие, междустрочный оступ срабатывает.
Если увеличиваю отступ, дабы текст выглядел нормально, получаю такое явление, что текст не на уровне картинки-стрелочки, а уползает вниз, и выглядит это не красиво.
На данный момент выставлено
line-height: 15px;
margin: 1px 1px 3px 1px;
 padding: 4px 3px 8px 27px;
Помогите настроить так, чтобы и текст был практически по центру надписи, и междустрочный интервал был нормальным (т.е. текст нормально читался, не наползал друг на друга.

Адрес сайта http://uklideruz.ucoz.org/
| Автор: | Категория: Дизайн сайта
Изменение категории | | Автор: webanet

Ответов: 1

голоса: 0

Пропишите в стили:

.blockcontent ul {padding:5px!important;}

это решит проблему.

| Автор:

не помогло. Возможно не так меня поняли.
Я имею ввиду размещение текста по высоте в каждом из блоков по отношению к картинке стрелочки на фоне слева.

https://i104.fastpic.ru/big/2018/0719/c6/420eeb0604c10d47bdd90ac1dfc4b1c6.png

 

Александр Неизвестный,
Помогло, просто нужно иметь меру в длине пунктов меню, в вашем случае нельзя делать длинее 20 символов.

Видимо я в другой вселенной живу, если вот такое является нормой
https://i105.fastpic.ru/big/2018/0719/7f/daebfd7e8855f2a7e9ebc96f936b867f.png
Сделал сам:
https://i104.fastpic.ru/big/2018/0719/6f/3985571464cbe6276b53ce36053a026f.png

  line-height: 20px;
 padding: 0px 3px 8px 27px;

Александр Неизвестный,
Смотрите что я советовал добавить и что вы добавили, в таком случае конечно не поможет. Я советовал с значение 5 добавить, вы с 20 прописали, тогда конечно никак не поможет.
в таком случае да, получилось, при наличии моей поправочки и вашей смотрится нормально. Ну разве что высота после последней строки текста и рамки блока почти мизерная выходит, щас вот на сайте глянуть ее можно как раз.
Добавил ниже еще 1 пункт, получилась снова дичь  https://i105.fastpic.ru/big/2018/0719/ae/b2a248a1f218afbf543cecccf0f5b1ae.png  Исправил добавлением height:auto;  Извиняюсь за беспокойство, только учусь.
...