Jump to content

Выравнивание пунктов списка с добавленным элементом


Recommended Posts

День добрый! Набиваю руку в простенькой верстке придуманного мной сайта. Возникла проблема из за которой рву на себе волосы уже 2е сутки - это выравнивание пункта текста с добавленной картинкой вместо привычных точек. Перепробовал уже все,с list-style-image вообще сделать что либо бесполезно. Перешел на изменения в самом <li>, текст просто накладывается на картинку и сделать ничего не получается. Размер картинки 64x64. Поиски в интернете успехом не увенчались. 

Ниже мой сырой код по этому вопросу:

li {
list-style-type: none;

}
li:before{
content: url("http://s1.iconbird.com/ico/2013/9/447/w128h12813804433922.png");
width: 30px;
height: 30px;
display: grid;
margin-top: 2%;
}

Должно получится как на картинке:

 

unnamed.png

Link to post
Share on other sites

Почему то не отображает саму картинку, остаются точки, так как list-style-type: none; пришлось удалить. Я на самом деле вообще не могу понять почему не получается, т.к. у вас очень доступный пример, но отображения нету у меня.

Link to post
Share on other sites
12 часов назад, AndrewLite сказал:

Почему то не отображает саму картинку, остаются точки, так как list-style-type: none; пришлось удалить. Я на самом деле вообще не могу понять почему не получается, т.к. у вас очень доступный пример, но отображения нету у меня.

смотрите может стили наследуются

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Member Statistics

    47,087
    Total Members
    1,451
    Most Online
    Mikhail30
    Newest Member
    Mikhail30
    Joined
  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...