Выравнивание списка <ul> по вертикали

[Ant0n39]

Добрый день!

Подскажите пожалуйста, споткнулся на простецкой задачи. Как можно выравнять нумерованный список по вертикали, относительно нумерации?

http://skremont39.ru/prajs

Сейчас текст выравнивается по нижней части.

Спасибо!

 

[Switch74]

li a {
    vertical-align: top;
}

 

[Ant0n39]

Спасибо большое! Сейчас встало более или менее нормально, не бросается так в глаза.

Подскажите, а как сделать к обычному тексту?

К примеру список на главной странице

http://skremont39.ru/

Там

li {
    vertical-align: top;
}

Не срабатывает(

 

[Switch74]

почитайте про vertical-align
у разных элементов он работает по разному
в вашем случае он будет отрабатывать на элементах относительно соседних
https://habr.com/ru/company/netcracker/blog/277433/

[spdif]

Можно добавить этот маркер как фоновое изображение для элемента < li > 

с выравниванием по вертикали по центру, задав для этого позицию фона = 0% 50% 

а текстовое содержимое  элемента < li >  выравнивать внутренними отступами - padding ,)) 

    <! ———- Your current style ———- >

.inner ul,   .inner ol   {

        margin: 10px 0 10px 20px;

}

.main-content li   {

        vertical-align: top;

        font-size: 14px;

        line-height: 1.8;

        list-style-image: url(images/galka.png);

        list-style-position: outside;

}

    <! —— Your current style end ——- >

    /*  —————--   V / S   —————-  */

    <! — Future style perspective —— >

.inner ul,   .inner ol   {

        margin: 10px 0 10px 0;

}

.main-content li   {

        background: url(images/galka.png) 0% 50% no-repeat;

        list-style-type: none;

        padding: 4.5px 0 4.5px 30px;

}

 

    <! — Future style perspective end — >

 

P.s _ .(.

           _this decision is okay ☑️ 

.).

...

[Ant0n39]

Спасибо большое за ответ!

Попробую обязательно и такой вариант, сейчас вышел из ситуации уменьшив размер иконки

http://skremont39.ru/

Сегодня еще поэкспериментирую.

Спасибо за помощь!

Edited February 14, 2019 by Ant0n39